My for loop does not iterate in Javascript

Question

I have a for loop that thinks 1 > 2 and goes out of its loop. It's supposed to put JSON root objects into a HTML select with option tags. It has to show two options, but it only shows one in my code. Here is the JSON:

 [{
  "batch": {
  "batch_id": 0,
"questions": [{
  "name": ["Communicatie"],
  "question_id": 25,
  "mark": ["9", "7", "10"]
    }, {
      "name": ["Samenwerking"],
  "question_id": 27,
  "mark": ["9", "8", "7"]
}, {
  "name": ["Dienstverlening"],
  "question_id": 30,
  "mark": ["9", "2", "5"]
}, {
  "name": ["Facturatie"],
  "question_id": 28,
  "mark": ["8", "7", "5"]
}, {
  "name": ["Technische kennis"],
  "question_id": 22,
  "mark": ["9", "8", "7"]
}, {
  "name": ["Distributieproces"],
  "question_id": 29,
  "mark": ["4", "7", "5"]
}, {
  "name": ["Overleg"],
  "question_id": 24,
  "mark": ["6", "8", "7"]
}, {
  "name": ["Markt kennis"],
  "question_id": 23,
  "mark": ["6", "7"]
}, {
  "name": ["Flexabiliteit"],
  "question_id": 26,
  "mark": ["3", "6", "7"]
    }]
  }
}, {
  "batch": {
"batch_id": 1,
"questions": [{
  "name": ["Communicatie"],
  "question_id": 25,
  "mark": ["7", "2"]
}, {
  "name": ["Samenwerking"],
  "question_id": 27,
  "mark": ["4", "7"]
}, {
  "name": ["Dienstverlening"],
  "question_id": 30,
  "mark": ["6", "4"]
}, {
  "name": ["Facturatie"],
  "question_id": 28,
  "mark": ["8", "3"]
}, {
  "name": ["Technische kennis"],
  "question_id": 22,
  "mark": ["6"]
}, {
  "name": ["Distributieproces"],
  "question_id": 29,
  "mark": ["3", "7"]
}, {
  "name": ["Overleg"],
  "question_id": 24,
  "mark": ["8", "4"]
}, {
  "name": ["Markt kennis"],
  "question_id": 23,
  "mark": ["3", "7"]
}, {
  "name": ["Flexabiliteit"],
  "question_id": 26,
  "mark": ["6", "2"]
}]
  }
}];

I have isolated a small snippet of the code here. Luckily, this particular part of code works, so it is not the problem, but I just want to let you know what I want to do with the code.

Here is my full code with comments:

 $(document).ready(function(){
    $.getJSON("/rest/BatchService/batches", function(json)
    {
        //json.length = 2, json is an arraylist of jsonobjects
        for(var i = 0; i < json.length; i++){
            //get batchid
            batchid = json[i]["batch"]["batch_id"];
            //put batchids into an option with value batchid tag and put it in select tag
            var option=$('<option />').val(json[i]["batch"]["batch_id"]).text("Batch " +json[i]["batch"]["batch_id"]);
            $("#dropdownBatches").append(option);

            //get from 'questions' the name and marks and put it in vars so that I can later put it in ChartJS
            var questions = json[i]["batch"]["questions"];
            for(var i in questions){
                var name= questions[i]["name"];
                chartjslabels.push(name);
                console.log(name);

                var marks = questions[i]["mark"];
                var sum = 0;
                for(var i = 0; i < marks.length; i++){
                    sum+= parseInt(marks[i]);
                }
                var avg = sum/marks.length;
                chartjsdata.push(avg);
            }
        }

Some additional information:

I made breakpoints everywhere and at the last curly bracket, where it suppose to go to the next iteration, it stops and goes to my ChartJS to make a chart.

All in all, there is a hidden break in my code, that stops the for loop. I can't find it.

You are using i thrice.

Jamiec
– Jamiec

2016-06-28 07:41:52 +00:00
Commented Jun 28, 2016 at 7:41 — Jamiec
– Jamiec, Commented Jun 28, 2016 at 7:41

Özgür Ersil · Accepted Answer · 2016-06-28 07:41:35Z

its because you use the same variable i for each loop, use it with different increments [i,j,z] here

$(document).ready(function(){
    $.getJSON("/rest/BatchService/batches", function(json)
    {
        //json.length = 2, json is an arraylist of jsonobjects
        for(var i = 0; i < json.length; i++){
            //get batchid
            batchid = json[i]["batch"]["batch_id"];
            //put batchids into an option tag and put it in select tag
            var option=$('<option />').val(json[i]["batch"]["batch_id"]).text("Batch " +json[i]["batch"]["batch_id"]);
            $("#dropdownBatches").append(option);

            //get from 'questions' the name and marks and put the variables in a chart
            var questions = json[i]["batch"]["questions"];
            for(var j in questions){
                var name= questions[j]["name"];
                chartjslabels.push(name);
                console.log(name);

                var marks = questions[j]["mark"];
                var sum = 0;
                for(var z = 0; z < marks.length; z++){
                    sum+= parseInt(marks[z]);
                }
                var avg = sum/marks.length;
                chartjsdata.push(avg);
            }
        }

Piyush.kapoor · Accepted Answer · 2016-06-28 07:41:58Z

You are using the same variable i ,Change the inner loop to something else

       for(var j in questions){
            var name= questions[j]["name"];
            chartjslabels.push(name);
            console.log(name);

            var marks = questions[j]["mark"];
            var sum = 0;
            for(var k = 0; i < marks.length; i++){
                sum+= parseInt(marks[k]);
            }
            var avg = sum/marks.length;
            chartjsdata.push(avg);
        }

Guillaume · Accepted Answer · 2016-06-28 07:44:31Z

1

The problem here is very simple, you are using the i variable in 3 nested for loops, so its value gets incremented several times, causing the parent for loop to run only once.

answered Jun 28, 2016 at 7:44

Guillaume

5493 silver badges14 bronze badges

Comments

Tom · Accepted Answer · 2016-06-28 07:43:36Z

0

 for(var i in questions){

       for(var i = 0; i < marks.length; i++){

using i for both loops is causing the behaviour you are seeing.

answered Jun 28, 2016 at 7:43

Tom

8,1908 gold badges47 silver badges63 bronze badges

Comments

Destion · Accepted Answer · 2016-06-28 08:00:44Z

0

You cannot use the same variable name in nested for-loops. This means the i-var will be incremented in all the loops, meaning the code will not be executed as you want it to.

Change the variable names to other letters to fix your problems.

answered Jun 28, 2016 at 8:00

Destion

14 bronze badges

Collectives™ on Stack Overflow

My for loop does not iterate in Javascript

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Related