Variable Defining Issue Javascript

Question

I'm trying to randomize a string depending on how many players their are and assign each player their job/role. In the Chrome Console I am getting the error, "Uncaught ReferranceError: al is not defined." I dont get what the issue is, the variable is defined before using it(defined in first button, used in second). I have an alert in the document that proves the variable is defined, and when pressing the button it says in the parameters al. HTML:

    <input maxlength="1" id="input"> <button id="gp" onclick="gp()">Start!</button>
    <br/>
    <br/>
    <button id="DJ" onclick="DJ(al, rl);BlankDisplay(al, rl)">Display Your Job!</button>
    <br/>
    <span id="DS">1) Input Amount Of Players. 2)Click 'Display Your Job!'</span>

Javascript:

function gp(){
    players = document.getElementById("input").value;
    if(isNaN(players)){
        alert(players.toUpperCase() + "'s Players? Please Fix"); 
        return;
    }
    if(players === " "){
        alert("Please Define How Many People Are Playing!");
        return;
    }
    if(players === ""){
        alert("Please Define How Many People Are Playing!");
        return;
    }
    if(players < 4){
        alert("Sorry, You Need Atleast 4 Players To Play!");
        return;
    }
    SA(players)
}
function SA(players){
    var positions = ["Murderer", "Judge", "Innocent", "Innocent"]; //Pre-set positions
    if(players == 5){
        positions.push("Co-Judge");
    }else if(players == 6){
        positions.push("Innocent", "Co-Judge"); 
    }else if(players == 7){
        positions.push("Murderer-2!", "Innocent", "Co-Judge");
    }
    Randomize(players, positions)
}
function shuffle(o){
    for(var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
    return o;
}
function Randomize(players, positions){
    var rl = shuffle(positions);
    var al = positions.length;
    confirm("You Have: " + al + " Players, Correct?");
    alert(al + ". " + rl);
}
function DJ(al, rl){
    var counter = 0;
    var bd = 0;
    for(var c = 0; c < al + 1; c++){
        if(counter == 0){
            document.getElementById("DS").innerHTML(rl[c]);
            document.getElementById("BJ").innerHTML("Click To Clear!");
            bd = 1;
        }
    }
}
function BlankDisplay(al, rl){
    if(bd == 1){
        document.getElementById("Click The Button Above To See Your Job!");   
    }
}

seems like an scope issue. you are trying to pass al & rl on the button with id DJ but the al & rl don't live in this scope. — Tahir Ahmed
– Tahir Ahmed, Commented May 26, 2015 at 0:22

Cooper Buckingham · Accepted Answer · 2015-05-26 00:24:37Z

1

You have two function, DJ and BlankDisplay (nevermind the use of caps) that both take arguments of al and rl, but second function doesn't make use of al, or rl. Then in this code: <button id="DJ" onclick="DJ(al, rl) you pass in the variables al and rl into the function call for DJ, but unless you've defined the var al and rl as properties on the window/global scope, then those are undefined.

I'm guessing you're confused about the distinction between a variable and and an argument. So I'd start there.

answered May 26, 2015 at 0:24

Cooper Buckingham

2,5342 gold badges17 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Coler234 Over a year ago

So do I have to define that variable like: "var al; & var rl;" before the first function? Is their any website you know that goes in-depth because I have lots of issues that have to do with undefined.

Cooper Buckingham Over a year ago

on click, that button will run the javascript code: DJ(al, rl) but what are al and rl?

Cooper Buckingham Over a year ago

to make it clearer to you, rename the arguments for function DJ to not be al, rl. Is it clear to you that the two varialbles being passed in can be differently named than the arguments that the function expects?

Tahir Ahmed · Accepted Answer · 2015-05-26 00:28:54Z

1

Remove the al & rl from your DJ parameters. They live in a global scope and should have access to al & rl WITHOUT the need of passing it via the DJ button's onclick.

Update button DJ like so: <button id="DJ" onclick="DJ(); BlankDisplay();">Display Your Job!</button>.
Add al and rl before everything in your JS like so: var al, rl;.
Omit var in your Randomize. So this: var rl = shuffle(positions); var al = positions.length; should become this: rl = shuffle(positions); al = positions.length;.
Change this line function DJ(al, rl){ to this function DJ(){.
Change this line function BlankDisplay(al, rl){ to this function BlankDisplay(){.

This should do.

answered May 26, 2015 at 0:28

Tahir Ahmed

5,7372 gold badges20 silver badges28 bronze badges

Collectives™ on Stack Overflow

Variable Defining Issue Javascript

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related