I’ve got a fairly simple code as i’m trying to learn javascript.
I find it challenging and fun so far but i’m not very good at it.
I made a functional die (1-6) and i thought i’d add to that by having this run:
function die(){
var x = Math.floor((Math.random() * 6) + 1);
document.getElementById("result").innerHTML = x;
}
function() {
var m = parseInt(document.getElementById("result").value, 10);
if(m == 1){
document.getElementById("output").innerHTML = "too low, try again!";}
else if(m == 2) {
document.getElementById("output").innerHTML = "still no luck";}
else if(m == 3) {
document.getElementById("output").innerHTML = "are you really going to continue?";}
else if(m == 4) {
document.getElementById("output").innerHTML = "you are being ridiculus";}
else if(m == 5) {
document.getElementById("output").innerHTML = "SO CLOSE! next time maybe!";}
else {
document.getElementById("output").innerHTML = "JACKPOT!";}
}
As some of you probably saw instantly it doesnt run, but i’m excluded from knowing why at the moment and would love to know what you know! Thank you in advance.
As a note: the die function works on its own, but breaks when i introduce the if / else function. The html is very uncomplicated and only serves to learning about javascript:
<div class="row-7 first">
<p> button that displays time and date:
</p>
<button id="button" type="button">Date and time</button>
<p id="date"> </p><br />
This is a calculator.<br />
<input id="x" type="text"></input> +
<input id="y" type="text"></input> =
<p id="sum"></p><br />
<input id="plus" type="button" value="Add"></button>
<p id="output"> </p>
</div>
<div class="row-3 last">
<p>Here is a die for you</p>
<input id="die" type="button" value="Roll dice"></button>
<p id="result"></p>
<script src="JavaScript.JS"></script>
</div>
Where in your code do you call the function die()?
By the way, even if the html is just a simple sample to help you test your javascript, you should really fix all the errors in the html before you try to run the JavaScript.
1 Like
I’m sorry @webmachine, i accidentally left out the onclick part of the javascript:
document.getElementById("die").onclick = function() {die()};
function die(){
var x = Math.floor((Math.random() * 6) + 1);
document.getElementById("result").innerHTML = x;
}
This is how it looks. And yeah, i probably should fix the errors in the HTML shouldn’t i? what matters to me right now though, is learning. So any help is appreciated!
I have another question for you: did you have a special reason why you wrapped the conditional block in an anonymous function?
(Even if you are learning JavaScript, it is really important that all your code is error-free. It could be that your html code errors might be affecting the results you want.)
1 Like
@webmachine i’m going to be perfectly honest with you, english is not my native language so the main reason (i suspect atleast) i have issues with, and learn so slowly, the language of javascript is that i actually don’t know what the words that describe things in this language means. I have to look up array like once an hour because i forget it. So when you say conditional block, you’re telling me something i translate in my head and the translation is not connected to the programming language at all, if that makes any sense to you.
Which block is the conditional block? and yes, of course the HTML should be good enough to work with javascript. The page i’ve built is just a standard grid system with 12 columns, i’ve got a dropdown navigation bar and some other stuff in there too, but i’m going to need some more help understanding what i’m doing wrong and especially (THIS IS THE IMPORTANT PART for me) how it relates between languages.
Okay, here - this will be better.
You have
var m = parseInt(document.getElementById("result").value, 10);
if(m == 1){
document.getElementById("output").innerHTML = "too low, try again!";}
else if(m == 2) {
document.getElementById("output").innerHTML = "still no luck";}
else if(m == 3) {
document.getElementById("output").innerHTML = "are you really going to continue?";}
else if(m == 4) {
document.getElementById("output").innerHTML = "you are being ridiculus";}
else if(m == 5) {
document.getElementById("output").innerHTML = "SO CLOSE! next time maybe!";}
else {
document.getElementById("output").innerHTML = "JACKPOT!";}
inside a function. Why?
Why don’t you just put it in the die() function and change all the ms to x?
1 Like
Perfect response, i’ll try right away and get back to you! thank you 
i thought from reading at w3schools and watching videos on youtube about if / else functions that they had to be inside a function, and dividing the functions up to keep different functions separate seemed the right thing to do, so i might call just the die to another function later. But i don’t know, as i’ve said.
Edit: so it kinda works, it returns only the “else” function because it does not convert the strings to numbers properly i think, but i am not sure. Do you have any ideas @webmachine?
Edit 2: nevermind i’ve figured it out! thank you very much for your help. I would still like to know what a conditional block is, tried googling but there was no clear javascript definition i could find. I’ll keep looking though, thank you.
They might be referring to the IIFE (Immediately Invoked Function Expression) which the code is often put into so that it doesn’t get mixed up with other JavaScript code due to variables from each script having the same name, but it might be better to learn about that at a later time.
1 Like
I erased the var m = parseInt(document.getElementById(“result”).value, 10);
i replaced all M with X (lower case) and it sorta worked so i figured that since i’m now in the die function i don’t need to fetch the value as a string but i get the number directly and no longer needed to use that variable. It works now and cycles through the 6 options when i click my button.
I’m looking forward to learning more about this language, but i think i might need to find someone who can mentor me a little in this. CSS and HTML (flawed though it may be when i write it) was easier to wrap my head around and atleast understand somewhat.
I’m looking forward to learning python, ruby, or php. Which language do you think would be more fun to learn? i don’t think i can learn all three and i want to have fun.
@webmachine also, i just realized i am curious how this die works now.
What if i start with just the die (ignore the if / else statement) and i want to create a filter for it that changes it?
so instead of the die being 1-6 i have a filter “above” it that depending on ITS outcome, the die can be anywhere from 0-1 or 0-10000 or 500-10000 or anywhere like that. Do you understand what i’m talking about? is it possible in javascript to create such a filter?
I might have used the wrong technical term when I said “conditional block”. A block of code is usually all the code that is between the { }. A conditional statement is one that starts with “if”. But I meant all that code that you had within function()
If you want to have fun, I would stick to just one language until you are able to build small projects with it. If you try to learn too many ‘similar’ languages at once you will become confused and not learn either of them well.
For example, it is okay (and good) to learn HTML, CSS and JavaScript at the same time because they are not similar. But I would not learn JavaScript and PHP at the same time. Become fairly good at one before you start learning the other one.
After JavaScript, I would suggest PHP, not Python or Ruby, only because PHP is the one I like to use. Other people might prefer Python or Ruby. It really doesn’t matter.
1 Like
Yes, just add your minimum value and maximum value to the parameters: function die(min, max). Change the formula for calculating the random number (I can help you with that if you get stuck) and then call the function like this: die(500, 1000)
1 Like
allright. I’ve watched some “comparing” videos and atleast php and python seem like they are very similair not only to eachother but to javascript aswell. but that is probably because the basis for programming is math and you can only differentiate in so many ways hehe. Yeah, PHP is more popular, more jobs are listed for that language and it has more support and so on, atleast what i’ve found out about it. I only started learning html and css last friday, and javascript like two days ago. i’m still very new, but i love it so far.
I’m glad you enjoy coding. If you have time, you might want to start a thread in the html section of this forum and post the html code that you have here so people can help you fix the errors.
1 Like
i ran the html code through a checker earlier and what it said was that it was valid with some unnecessary breaks and so i removed those, also something was wrong with the meta tag, not sure what because even when i translate the words into my own language it makes no sense to me, i’m kind of sad that i have such a hard time thinking abstract.
I’m going to make an input box (text) and link that to my die and see if i can use the input there to change the die, thats not an automated filter but close. i think. you’re awesome by the way :D!
1 Like
Ok @webmachine
I’ve come to this now
document.getElementById("dietwo").onclick = function(){dietwo()};
function dietwo(){
var y = document.getElementById("die-settingL");
var x = document.getElementById("die-settingU");
var u = Math.floor((Math.random() * x) + y);
document.getElementById("output").innerHTML = u;
}
It spits out nan for some reason, are x and y not equal to numbers when their values are whatever i put into the input boxes? i obviously only use numbers but are they treated as strings?
Yes I believe that the values you get from input boxes are strings. If you wonder about things like that, try Googling the question. So when you assign values to y and x, use parseInt to convert them to numbers.
By the way, I formatted your code for you to make it easier to read. To do that, I put three backticks (`) on the line before the code and three backticks on the line after the code.
1 Like
I’m not sure what you mean, you formatted the HTML? or the js? either way it is 2.21 am here and i’m going to bed in a few minutes when i’ve figured this out. i’ll parseInt and see if that helps I do google a lot, w3schools is great but not so much for javascript because of how different their inline examples are from the external file format of the text. It confuses things for me when i read inline examples and try to implement it in an external .js
Either way i’m happy for your massive help! i understand javascript a tiny bit better now and that is all anyone can ask a stranger on the internet for! i hope your day is really damn good 
bye for now, i’ll check in tomorrow.
Do you see how your code is now in a blue box, and the code is coloured? That is formatting the code. It makes it easier for us to read it.
1 Like
Ah yes! i have noticed people do edit my posts and that happens, is that something i can do myself? just by adding ’ x3?
I sort of got the thing to work, it does not change the lower dice cap or the higher dice cap like i wanted to, instead, i realized, it just grabs a random number between 0 and whatever x and y equals. Which is not at all what i wanted. Its very much what i made though.