Loop through JSON array, display two and then Count

Question

Okay, so I'm a JSON noob with only basic jQuery knowledge and I've looked all over for a solution and can't find one. Any help is greatly appreciated.

I need to:

1) loop through a JSON array (working)

2) display the first two results for "mbrname"

3) then display a count for the rest of the results.

I am successfully looping through and displaying ALL mbrname results. But somehow I need to only display the first two and if there are more display "+ # others"

Here's a screenshot of what the final product should look like: enter image description here

Here's what my code produces now: enter image description here

Here's my JSON:

{
 "messages":{
  "message":[
     {
        "date-time":"June 2, 2013 12:22 pm",
        "subject":"This is the message subject",
        "msg-string":"001",
        "newmsg":"true",
        "attach":"shop-cart",
        "recipient":[
           {
              "mbrname":"D. Craig",
              "mbr-href":"#craig"
           },
           {
              "mbrname":"N. McCoy",
              "mbr-href":"#mccoy"
           },
           {
              "mbrname":"J. Smith",
              "mbr-href":"#smith"
           },
           {
              "mbrname":"B. Wardlaw",
              "mbr-href":"#wardlaw"
           }
        ]
     },
     {
        "date-time":"May 23, 2013 12:22 pm",
        "subject":"This is a great subject",
        "attach":"none",
        "msg-string":"002",
        "newmsg":"true",
        "recipient":[
           {
              "mbrname":"D. Craig",
              "mbr-href":"#craig"
           },
           {
              "mbrname":"N. McCoy",
              "mbr-href":"#mccoy"
           }
        ]
     },
     {
        "date-time":"May 11, 2013 12:22 pm",
        "subject":"Interested in your tomatoes",
        "attach":"shop-cart",
        "msg-string":"003",
        "newmsg":"false",
        "recipient":[
           {
              "mbrname":"J. Smith",
              "mbr-href":"#smith"
           }
        ]
     }
  ]
 }
}

Here's my jquery just for the "mbrname" section which successfully pulls in the names and appends them to my HTML:

$.each (message.recipient, function (message, recipient) {
var mbrPart = recipient.mbrname + ', ';
var currentUser = $('#' + newID + ' .name');

$(currentUser).append(mbrPart);

});

Thanks in advance for any help!

Felix Kling · Accepted Answer · 2014-04-11 17:43:41Z

6

I'd keep it simple, no need to do any looping:

var recipientString = message.recipient[0].mbrname;
var count = message.recipient.length;

if (count > 1)
    recipientString += ', ' + message.recipient[1].mbrname;

if (count > 2)
    recipientString += ' + ' + (count - 2) + ' others';

$('#' + newID + ' .name').append(recipientString);

edited Apr 11, 2014 at 17:43

Felix Kling

820k181 gold badges1.1k silver badges1.2k bronze badges

answered Apr 11, 2014 at 17:29

Jason P

27k3 gold badges34 silver badges45 bronze badges

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

7 Comments

Felix Kling Over a year ago

Yep. jQuery and $.each is all fancy, but sometimes, not using it results in better solutions.

GrahamTheDev Over a year ago

better answer - +1 for you too sweety!

Aboba Over a year ago

Yea I switched from my answer too :)

Nicole McCoy Over a year ago

Thanks for your help. UNfortunately this breaks and in firebug I see this error: "ReferenceError: invalid assignment left-hand side" on if (count > 1) recipientString += ', ' = message.recipient[1].mbrname;

Felix Kling Over a year ago

@NicoleMcCoy: = should have been +.

|

Aboba · Accepted Answer · 2014-04-11 17:26:00Z

1

Something like this should work.

var count = 0;
$.each (message.recipient, function (message, recipient) {


if(count<2){
var mbrPart = recipient.mbrname + ', ';
var currentUser = $('#' + newID + ' .name');
$(currentUser).append(mbrPart);
}
count++;
});

$(currentUser).append(" + " + count-2 + " Others");

answered Apr 11, 2014 at 17:26

Aboba

2861 silver badge10 bronze badges

3 Comments

GrahamTheDev Over a year ago

just beat me to it - for efficiency move var mbrPart inside the if(count) part so not initialising the var each time when not needed. +1

Aboba Over a year ago

I like Jason's answer better now.

worc Over a year ago

not sure if this is what you want, you'll end up with A. Craig, B.McCoy + 0 Others if you pass in exactly two recipients.

Collectives™ on Stack Overflow

Loop through JSON array, display two and then Count

2 Answers 2

7 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related