I have the following JSON returned in a variable called data.
THIS IS THE JSON THAT GETS RETURNED...
[
{"Id": 10004, "PageName": "club"},
{"Id": 10040, "PageName": "qaz"},
{"Id": 10059, "PageName": "jjjjjjj"}
]
and I am trying to loop through the collection using $.each but I am running into problems where the alert is showing undefined. I have tried a lot of different syntax but can't seem to figure this out.
The JQuery I am using is
$.each(data, function(i, item) {
alert(item.PageName);
});
Can any one point me in the right direction?
EDIT This is the code I am using to grab the data
$.getJSON('/Cms/GetPages/123', null, function(data) {
fillSelect(data);
});
and this is the function that gets called upon call back
function fillSelect(data) {
alert(data);
$.each(data, function(i, item) {
alert(item.PageName);
});
}
EDIT 2 This is slightly confusing me, according to the docs it should work as I have it, but it doesn't. According to fiddler the header shows:-
Content-Type: application/json; charset=utf-8
and the JSON is exactly correct above. I am using chrome if this makes any different. Will test in IE and FF....
EDIT 3
using $.get produces
"[\r\n {\r\n \"Id\": 10041,\r\n \"PageName\": \"01234567890\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n },\r\n {\r\n \"Id\": 10001,\r\n \"PageName\": \"about\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 1\r\n },\r\n {\r\n \"Id\": 10056,\r\n \"PageName\": \"fdgdfgdfg\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 1\r\n },\r\n {\r\n \"Id\": 10052,\r\n \"PageName\": \"hjkhjk\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n },\r\n {\r\n \"Id\": 10059,\r\n \"PageName\": \"jjjjjjj\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 1\r\n },\r\n {\r\n \"Id\": 10057,\r\n \"PageName\": \"qqqqq\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n },\r\n {\r\n \"Id\": 10054,\r\n \"PageName\": \"qwqw\",\r\n \"MetaId\": 1000,\r\n \"TemplateId\": 2\r\n }\r\n]"
var data = [
{"Id": 10004, "PageName": "club"},
{"Id": 10040, "PageName": "qaz"},
{"Id": 10059, "PageName": "jjjjjjj"}
];
$.each(data, function(i, item) {
alert(data[i].PageName);
});
$.each(data, function(i, item) {
alert(item.PageName);
});
these two options work well, unless you have something like:
var data.result = [
{"Id": 10004, "PageName": "club"},
{"Id": 10040, "PageName": "qaz"},
{"Id": 10059, "PageName": "jjjjjjj"}
];
$.each(data.result, function(i, item) {
alert(data.result[i].PageName);
});
EDIT:
try with this and describes what the result
$.get('/Cms/GetPages/123', function(data) {
alert(data);
});
FOR EDIT 3:
this corrects the problem, but not the idea to use "eval", you should see how are the response in '/Cms/GetPages/123'.
$.get('/Cms/GetPages/123', function(data) {
$.each(eval(data.replace(/[\r\n]/, "")), function(i, item) {
alert(item.PageName);
});
});