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
– John Dvorak, Commented Mar 5, 2013 at 8:58

Mario S · Accepted Answer · 2013-03-05 10:13:45Z

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 5, 2013 at 10:13

answered Mar 5, 2013 at 9:10

Mario S

12k24 gold badges42 silver badges47 bronze badges

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

6 Comments

Vucko Over a year ago

Excellent. This gets all of the data but how to get the last one ?

Mario S Over a year ago

@Vucko What is the last one? =)

Vucko Over a year ago

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 ?

Mario S Over a year ago

@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?

Vucko Over a year ago

I meant the last one created.

|

Mario S · Accepted Answer · 2013-03-05 08:56:01Z

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 5, 2013 at 8:56

Mario S

12k24 gold badges42 silver badges47 bronze badges

answered Mar 5, 2013 at 8:54

sroes

15.1k1 gold badge58 silver badges75 bronze badges

Comments

SteveP · Accepted Answer · 2013-03-05 08:56:03Z

0

I think you need something like:

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

answered Mar 5, 2013 at 8:56

SteveP

19.2k9 gold badges49 silver badges62 bronze badges

Comments

Satish Sharma · Accepted Answer · 2014-01-02 12:48:06Z

0

try this

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

answered Jan 2, 2014 at 12:48

Satish Sharma

9,6356 gold badges31 silver badges52 bronze badges

1 Comment

SagarPPanchal Over a year ago

hello @satish can we use console.log(this.text); out each by creating an array?

Collectives™ on Stack Overflow

JQuery get data from JSON array

4 Answers 4

6 Comments

Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

6 Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related