JQuery get data from JSON array

Question

This is part of the JSON i get from foursquare.

JSON

tips: {
    count: 2,
    groups: [
    {
        type: "others",
        name: "Tips from others",
        count: 2,
        items: [
        {
            id: "4e53cf1e7d8b8e9188e20f00",
            createdAt: 1314115358,
            text: "najjači fitness centar u gradu",
            canonicalUrl: "https://foursquare.com/item/4e53cf1e7d8b8e9188e20f00",
            likes: {
                count: 2,
                groups: [
                {
                    type: "others",
                    count: 2,
                    items: []
                }],
                summary: "2 likes"
            },
            like: false,
            logView: true,
            todo: {
                count: 0
            },
            user: {
                id: "12855147",
                firstName: "Damir",
                lastName: "P.",
                gender: "male",
                photo: {
                    prefix: "https://irs1.4sqi.net/img/user/",
                    suffix: "/AYJWDN42LMGGD2QE.jpg"
                }
            }
        },
        {
            id: "4e549e39152098912f227203",
            createdAt: 1314168377,
            text: "ajd da vidimo hocu li znati ponoviti",
            canonicalUrl: "https://foursquare.com/item/4e549e39152098912f227203",
            likes: {
                count: 0,
                groups: []
            },
            like: false,
            logView: true,
            todo: {
                count: 0
            },
            user: {
                id: "12855147",
                firstName: "Damir",
                lastName: "P.",
                gender: "male",
                photo: {
                    prefix: "https://irs1.4sqi.net/img/user/",
                    suffix: "/AYJWDN42LMGGD2QE.jpg"
                }
            }
        }]
    }]
}

I need to get the last tip text , the user who wrote it and the date when he wrote/post it.

User: Damir P.

Date : 1314115358

Text: najjači fitness centar u gradu

I tried with JQuery and this works to fetch a non-array value:

$.getJSON(url, function(data){
    var text= data.response.venue.tips.groups.items.text;
    alert(text);
});

But it doesn't work with arrays.

Result : Uncaught TypeError: Cannot read property 'text' of undefined.

Also I tried with $.each, but with no effect.

$.getJSON(url, function(data){
    $.each(data.response.venue.tips.groups.items.text, function (index, value) {
        console.log(value);
    });
});

What am I doing wrong ?

@Johan I admit, it was badly formulated. All I wanted was to point him to the right resources, though. — John Dvorak, Mar 05 '13 at 08:58

Mario S · Accepted Answer · 2013-03-05T10:13:45.367

10

You need to iterate both the groups and the items. $.each() takes a collection as first parameter and data.response.venue.tips.groups.items.text tries to point to a string. Both groups and items are arrays.

Verbose version:

$.getJSON(url, function (data) {

    // Iterate the groups first.
    $.each(data.response.venue.tips.groups, function (index, value) {

        // Get the items
        var items = this.items; // Here 'this' points to a 'group' in 'groups'

        // Iterate through items.
        $.each(items, function () {
            console.log(this.text); // Here 'this' points to an 'item' in 'items'
        });
    });
});

Or more simply:

$.getJSON(url, function (data) {
    $.each(data.response.venue.tips.groups, function (index, value) {
        $.each(this.items, function () {
            console.log(this.text);
        });
    });
});

In the JSON you specified, the last one would be:

$.getJSON(url, function (data) {
    // Get the 'items' from the first group.
    var items = data.response.venue.tips.groups[0].items;

    // Find the last index and the last item.
    var lastIndex = items.length - 1;
    var lastItem = items[lastIndex];

    console.log("User: " + lastItem.user.firstName + " " + lastItem.user.lastName);
    console.log("Date: " + lastItem.createdAt);
    console.log("Text: " + lastItem.text);
});

This would give you:

User: Damir P.
Date: 1314168377
Text: ajd da vidimo hocu li znati ponoviti

edited Mar 05 '13 at 10:13

answered Mar 05 '13 at 09:10

Mario S

11,715
24
39
47

Excellent. This gets all of the data but how to get the last one ? – Vucko Mar 05 '13 at 09:20
@Vucko What is *the last one*? =) – Mario S Mar 05 '13 at 09:23
1

In this case, text **najjači fitness centar u gradu** is the last one. So is the last one `item[0].text` or `item[1].text` ? And how to approach this with your code ? – Vucko Mar 05 '13 at 09:27
@Vucko I have updated the answer. But the text you are talking about is the *first* in the array and not the *last*. By *last*, do you mean the last one in the array or the *latest* by the `createdAt` date? – Mario S Mar 05 '13 at 10:15
I meant the last one created. – Vucko Mar 05 '13 at 10:18
@Vucko Ok, then just do a sort on the `createdAt` in the items-array before fetching the item. Have a look [here](http://stackoverflow.com/questions/5503900/how-to-sort-an-array-of-objects-with-jquery-or-javascript) on how to sort an array. I'm sure you can manage that =) – Mario S Mar 05 '13 at 12:15

score 6 · Answer 2 · edited Mar 05 '13 at 08:56

6

You're not looping over the items. Try this instead:

$.getJSON(url, function(data){
    $.each(data.response.venue.tips.groups.items, function (index, value) {
        console.log(this.text);
    });
});

edited Mar 05 '13 at 08:56

Mario S

11,715
24
39
47

answered Mar 05 '13 at 08:54

sroes

14,663
1
53
72

score 0 · Answer 3 · answered Mar 05 '13 at 08:56

0

I think you need something like:

var text= data.response.venue.tips.groups[0].items[1].text;

answered Mar 05 '13 at 08:56

SteveP

18,840
9
47
60

score 0 · Answer 4 · answered Jan 02 '14 at 12:48

0

try this

$.getJSON(url, function(data){
    $.each(data.response.venue.tips.groups.items, function (index, value) {
        console.log(this.text);
    });
});

answered Jan 02 '14 at 12:48

Satish Sharma

9,547
6
29
51

hello @satish can we use `console.log(this.text);` out each by creating an array? – SagarPPanchal Apr 21 '14 at 12:43

JQuery get data from JSON array

4 Answers4

Linked