How can I loop through numbered variables in javascript

Question

I have data that is being returned from a JQuery .ajax function as an array.

Now the fields in that array are named & numbered i.e part1, part2, part3, etc.

I have some code below that I thought may loop through it but it returns NaN.

for (var a = 1; a <= 9; a++) {
newtext += '<div class="part">' + (exploded[0].part + a) + '</div>';
}

I couldn't get any of the sugegstions to work so I did this instead.

var h = new Array();
h[1] = exploded[0].part_1;
h[2] = exploded[0].part_2;
h[3] = exploded[0].part_3;
h[4] = exploded[0].part_4;
h[5] = exploded[0].part_5;
h[6] = exploded[0].part_6;
h[7] = exploded[0].part_7;
h[8] = exploded[0].part_8;
h[9] = exploded[0].part_9;

I know it is a bit long winded but when I am dealing with multiple songs also I can loop them all with the array keys.

@Broxzier — The question says the properties are called `part1` etc. That wouldn't work. — Quentin, May 30 '13 at 06:42
Sorry I might not have explained it quite right. It's the field names that need looping through (part1 - 9) not the array itself. — Matt Bridges, May 30 '13 at 06:42
You'd be better returning data from you ajax call in the form of an array instead of a set of variables with a number appended on the end. Both XML and JSON would support that. — GordonM, May 30 '13 at 06:43
@GordonM Although I understand how that would work I'm not sure it would fit into my database structure very well. The database is full of song lyrics and each of those "part" fields is a Verse/Chorus etc. — Matt Bridges, May 30 '13 at 06:45
@MattBridges You can have the server side script reformat the data as necessary, or you may need to rethink your database schema. — GordonM, May 30 '13 at 08:57
@GordonM is there any way of getting the array in a php style ie exploded[key][key] — Matt Bridges, May 30 '13 at 09:03

nix · Accepted Answer · 2013-05-30T09:22:11.703

4

Try it this way:

for (var a = 1; a <= 9; a++) {
    newtext += '<div class="part">' + (exploded[0]['part_' + a]) + '</div>';
}

edited May 30 '13 at 09:22

answered May 30 '13 at 06:48

nix

3,262
2
21
36

That returns undefined. I guess that's not the fields it's looping through. – Matt Bridges May 30 '13 at 06:50
1

Could you please show an example of the array? Is it something like this: `[{ part1: 'part1', part2: 'part2'},{ part1: 'part1', part2: 'part2'}]` or `{0:{ part1: 'part1', part2: 'part2'},1:{ part1: 'part1', part2: 'part2'}}` ? – nix May 30 '13 at 06:51
Nix is right. He needs more details. – Mark May 30 '13 at 07:13
This is the output before being JSON parsed"[{"title":"Cornerstone","firstline":"","keysignature":"C","copyright":"","part_1":"","part_2":"","part_3":"","part_4":"","part_5":"","part_6":"","part_7":"","part_8":"","part_9":"","ref":"2"}]" – Matt Bridges May 30 '13 at 07:57
My solution seems to be working fine. Here's the fiddle: http://jsfiddle.net/up8UZ/ – nix May 30 '13 at 09:19

score 0 · Answer 2 · answered May 30 '13 at 06:45

0

You can iterate/loop through the items of array like this. You should use the property 'length' of array variable which tells how many items an array have...

var myStringArray = ["part1", "part2", "part3"];
for (var i = 0; i < myStringArray.length; i++) {
    alert(myStringArray[i]);
    //Do something
}

answered May 30 '13 at 06:45

Talha

18,898
8
49
66

Nope it's not the array I'm trying to loop through, it's the array's fields. – Matt Bridges May 30 '13 at 06:52

Sandeep Kumar · Answer 3 · 2013-05-30T10:36:53.307

0

Make sure you array exploded has 10 elements becuase the index of an array start with Zero so for 9 elements you can write the code like this

   for (var a = 0; a <= exploded.length; a++) {
        newtext += '<div class="part">' + (exploded[a].part + a) + '</div>';
        }
    alert(newtext);

Modified Response to access the propery dynamically ---------

    var newtext='';
            alert('hi');
    var exploded= {"title":"Cornerstone","firstline":"","keysignature":"C","copyright":"","part_1":"sandeep","part_2":"","part_3":"","part_4":"","part_5":"","part_6":"","part_7":"","part_8":"","part_9":"","ref":"2"};
    var prop='';
    var newhtml='';

    for (var a = 1; a <= 9; a++) {
        prop='part_' + a;

        newhtml+='<div class="part">' + (exploded[prop]) + '</div>';
    }
    alert(newhtml);

edited May 30 '13 at 10:36

answered May 30 '13 at 06:47

Sandeep Kumar

783
1
5
13

Nope that's not the right answer. The number in the array isn't the problem. I know my database has the fields part1 through part9. – Matt Bridges May 30 '13 at 06:51
But the index might be the problem. You are using loop from 1 to 9 which shold be 0 to 8 for the array having 9 elements. – Sandeep Kumar May 30 '13 at 07:01
No it's not 9 elements of an array. It's 9 fields of 1 element of an array. – Matt Bridges May 30 '13 at 08:05
So as per my understaning for now you are trying to access the propery of json object dynamically. to check this I am modifying my reponse. Hope this will work. – Sandeep Kumar May 30 '13 at 10:36

score 0 · Answer 4 · answered May 30 '13 at 07:08

0

What about the following:

var array=["part1", "part2", "part3"];
html=array.map(function(o){ return '<div class="part">'+o+'</div>' }).join("")
console.log(html);

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map?redirectlocale=en-US&redirectslug=JavaScript%2FReference%2FGlobal_Objects%2FArray%2Fmap

answered May 30 '13 at 07:08

Thomas Junk

5,588
2
30
43

Couldn't get it to work for some reason. – Matt Bridges May 31 '13 at 09:01
What browser are you using? http://jsfiddle.net/ZHBHE/ <- working example. – Thomas Junk May 31 '13 at 09:02

How can I loop through numbered variables in javascript

4 Answers4