Json array looping through using javascript getting wrong output

Question

I am pulling data from a JSON array similar to as follows:

"abridged_directors": [{
            "name": "Bill",
            "id": "742790769",
            "characters": ["Flint Lockwood"]
        }, {
            "name": "Anna",
            "id": "162654477",
            "characters": ["Sam Sparks"]
        }, {
            "name": "James",
            "id": "162656402",
            "characters": ["Tim Lockwood"]
        }, {
            "name": "Will",
            "id": "770670480",
            "characters": ["Chester V"]
        }, {
            "name": "Kristen",
            "id": "770792145",
            "characters": ["Barb"]
        }],

I am using a loop to correctly display the result. What I am looking for is: Bill, Ann, James, Will & Kristen

Instead I am getting: Bill, Ann, James, Will, & Kristen

For the second last name I do not want a comma and the following if else statement should cover that but it doesn't seem to be working?

for (var i = 0;i < data.abridged_directors.length; i++){
            if(i != 0 && i == data.abridged_directors.length-1){
                // and the position of the character is greater than 0
                $(document.body).append('& ' + data.abridged_directors[i].name + '<br>');
            }
            else if(i != data.abridged_directors.length-1 || i != data.abridged_directors.length-2){
                 $(document.body).append(data.abridged_directors[i].name + ', ');
            }
            else
                $(document.body).append(data.abridged_directors[i].name + '<br>');


   }

I have been looking at this for a good while now and making changes but nothing seems to work. It is possibly something small I'm not seeing so sorry if that turns out to be the case!

ezekielDFM · Accepted Answer · 2014-04-03 13:24:01Z

1

I'd like to offer a little cleaner method (imho). Instead of looping through and appending, try joining an array of the names and just replacing the last comma. See code:

var names = [];

for (var i = 0;i < data.abridged_directors.length; i++)
{
     names.push(data.abridged_directors[i].name);
}

$(document.body).append(names.join(', ').replace(/(.*),(.*)$/, "$1 & $2"));

Here's a jsfiddle: http://jsfiddle.net/zYdH9/

answered Apr 3, 2014 at 13:24

ezekielDFM

1,97713 silver badges26 bronze badges

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

1 Comment

Pete Over a year ago

Well done with the regex. I'm trying to avoid conditions and loops as much as possible in my coding these days. Your regex solution at the end is elegant.

Pete · Accepted Answer · 2014-04-03 13:41:23Z

1

If you are supporting only IE9+, then you can use a map to do this. The key thing here is a separation of duties. It makes it easier to understand. If you need IE9- support, then you can do this with a for loop. See ezekielDFM's solution.

[editted to include ezekielDFM regex command - much more cleaner solution]

Pseudo Code:

Build your data up first (map command)
Format your data (join command)
Fix formatting (replace command)

Javascript

var string_directors = data.abridged_directors
  .map(function(director) {
     return director.name; 
  })
  .join(', ')
  .replace(/(.*),(.*)$/, '$1 & $2');

edited Apr 3, 2014 at 13:41

answered Apr 3, 2014 at 13:21

Pete

3,2644 gold badges28 silver badges43 bronze badges

Comments

johusman · Accepted Answer · 2014-04-03 13:19:07Z

0

The || in the else if should be &&.

answered Apr 3, 2014 at 13:19

johusman

3,4721 gold badge19 silver badges11 bronze badges

Comments

Daniel Melo · Accepted Answer · 2014-04-03 13:51:35Z

0

i know you get the answer, but i spend some time with solution...kkk Hope Help someone:

$(json).each(function(i){  
    $("#result").append(this.name);
    if(j-2 == i)
        $("#result").append(" & ");
    else{
        if(!(j-1 == i))
        $("#result").append(", ");}
});

http://jsfiddle.net/Z5L4E/

answered Apr 3, 2014 at 13:51

Daniel Melo

5685 silver badges14 bronze badges

Collectives™ on Stack Overflow

Json array looping through using javascript getting wrong output

4 Answers 4

1 Comment

Pseudo Code:

Javascript

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Pseudo Code:

Javascript

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related