I am trying to display JSON data which is:
var jsonData = ({
"respond": 1,
"paging": {
"stillmore": 0,
"perpage": "10",
"callpage": "1",
"next": 0,
"previous": 0,
"pages": 1,
"result": "2"
},
"message": "",
"result": [{
"ID": "240",
"post_title": "\u041f\u043e\u043b\u0435\u0432\u0430\u044f",
"guid": "\/?post_type=transport&p=240",
"post_content": "",
"post_author": "1",
"post_date": "23\/01\/2014",
"post_date_gmt": "23\/01\/2014",
"comment_status": "closed",
"ping_status": "closed",
"post_name": "%d0%bf%d0%be%d0%bb%d0%b5%d0%b2%d0%b0%d1%8f",
"post_modified": "23\/01\/2014",
"post_modified_gmt": "23\/01\/2014",
"post_content_filtered": "",
"post_parent": "0",
"menu_order": "0",
"comment_count": "0",
"featuredimage": "",
"featuredthumb": "",
"category": [
],
"tags": [
],
"author": [{
"ID": "1",
"user_login": "test",
"user_nicename": "test",
"user_email": "",
"user_url": "",
"user_registered": "04\/09\/2013",
"display_name": "test",
"role": {
"editor": true
},
"first_name": "test",
"last_name": "test",
"nickname": "test",
"description": "",
"avatar": "http:\/\/1.gravatar.com\/avatar\/1785a8ddcb564c1cac83da9fc26bc48e?s=96&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&r=G",
"aim": "",
"jabber": "",
"yim": "",
"custom_fields": "ACF plugin needs to be enabled, Back to documentation for further information"
}]
}, {
"ID": "239",
"post_title": "\u041f\u0435\u0440\u0432\u0430\u044f \u0433\u043e\u0440\u0431\u043e\u043b\u044c\u043d\u0438\u0446\u0430",
"guid": "\/?post_type=transport&p=239",
"post_content": "",
"post_author": "1",
"post_date": "23\/01\/2014",
"post_date_gmt": "23\/01\/2014",
"comment_status": "closed",
"ping_status": "closed",
"post_name": "%d0%bf%d0%b5%d1%80%d0%b2%d0%b0%d1%8f-%d0%b3%d0%be%d1%80%d0%b1%d0%be%d0%bb%d1%8c%d0%bd%d0%b8%d1%86%d0%b0",
"post_modified": "23\/01\/2014",
"post_modified_gmt": "23\/01\/2014",
"post_content_filtered": "",
"post_parent": "0",
"menu_order": "0",
"comment_count": "0",
"featuredimage": "",
"featuredthumb": "",
"category": [
],
"tags": [
],
"author": [{
"ID": "1",
"user_login": "test",
"user_nicename": "test",
"user_email": "",
"user_url": "",
"user_registered": "04\/09\/2013",
"display_name": "test",
"role": {
"editor": true
},
"first_name": "test",
"last_name": "test",
"nickname": "test",
"description": "",
"avatar": "http:\/\/1.gravatar.com\/avatar\/1785a8ddcb564c1cac83da9fc26bc48e?s=96&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&r=G",
"aim": "",
"jabber": "",
"yim": "",
"custom_fields": "ACF plugin needs to be enabled, Back to documentation for further information"
}],
}]
});
on my page. What I need to get is all result.ID, result.post_title and result.author.ID, result.author.first_name, result.author.last_name.
My script is:
$.ajax({
url: jsonData,
timeout: 3000,
success: function (data) {
alert(data);
var data = $.parseJSON(data);
$.each(data, function (i, post) {
content += i.result.ID;
});
// console.log(content);
}
});
Please help me with my jsfiddle: http://jsfiddle.net/LS3Pg/
I am new to JQUERY so will really appreciate your help here. Thank you.
Just to be clear the jsonData part of your code is what will be received from your AJAX call?
Here is sample code that tests the loop based on your jsonData object:
var content = "";
$.each(jsonData.result, function (i, post) {
content += this.ID;
});
console.log(content);
Here is how it would look using a jQuery AJAX call.
$.get( "ajax/test.html", function( data ) {
var content = "";
$.each(data.result, function (i, post) {
content += this.ID;
});
console.log(content);
}, 'json');
It looks like you are using a get query. jQuery has a shortcut function for performing an AJAX get request, so I used that instead.
Other notes:
You can specify the data type in the get call at the end of the function. This way you don't have to use JSON.parse
Also the posts that are returned are held in the result variable, so you want to loop through that part of the data.
Using the jQuery.each function, the this variable will contain the post data you want as on object. From there you can use regular object access to get what you want. I just grabbed the ID here.
Here is a link to the jsFiddle: http://jsfiddle.net/B364k/1/
Here is a link to a jsFiddle that grabs the author ID, first name, and last name: http://jsfiddle.net/B364k/2/
Here's the relevant part here:
console.log(this.author[0].ID);
console.log(this.author[0].first_name);
console.log(this.author[0].last_name);
To access the author, it is an array, so you need to use array access to access an author's data. This is probably because there can be multiple authors per post.