CODEWITHSUNDEEP
javascriptjqueryfor-loop
Ryanthehouse
Ryanthehouse

Reputation: 301

Javascript loop iteration error

The loop does not seem to iterate correctly:

var selections = $("#primaryModal").find("select").not(".hidden");

for(var i = 0; i < selections.length; i++){
    console.log(selections.length);
    console.log("select");
    for(var i = 0; i < $(selection)[0].options.length; i++){
        console.log("option");
    }
}

Above is my loop and the following is the result in console:

enter image description here

What seems to be the issue here? The internal loop seems to work, but the outer loop iterates only once despite an array length of 2.

Upvotes: 0

Views: 67

Answers (2)

randominstanceOfLivingThing
randominstanceOfLivingThing

Reputation: 18642

You are working with javascript. Your code will get transformed to after variable hoisting:

var i;
for(i = 0; i < selections.length; i++){
    console.log(selections.length);
    console.log("select");
    for(i = 0; i < $(selection)[0].options.length; i++){
        console.log("option");
    }
}

which means you are not having two different variables in different scopes. You should rather go with Robert Fines suggestion and change the variable name so that your code will work like and you do not have any side-effects.

var i, j; 
for(i = 0; i < selections.length; i++){
    console.log(selections.length);
    console.log("select");
    for(j = 0; j < $(selections)[i].options.length; j++){
        console.log("option");
    }
}

Upvotes: 1

Robert Fines
Robert Fines

Reputation: 720

You are using the same loop index for both loops and the variable selection is not defined. Try something like this:

var selections = $("#primaryModal").find("select").not(".hidden");

for(var i = 0; i < selections.length; i++){
    console.log(selections.length);
    console.log("select");
    for(var j = 0; j < $(selections)[i].options.length; j++){
        console.log("option");
    }
}

Upvotes: 3

Related Questions