Reading Json Data in Jquery

Question

I have this Json data returning from a service.

here is my complete json data

 d: "[{"ImagePath":null,"ThemeTemplateId":1,"BorderWidth":null,"BorderStyle":null,"OptionTextUnderline":null,"OptionTextItalic":null,"OptionTextBold":null,"OptionTextSize":null,"OptionTextFont":null,"QuestionTextUnderline":null,"QuestionTextItalic":null,"QuestionTextBold":null,"QuestionTextSize":null,"QuestionTextFont":null,"SurveyTitleUnderline":null,"SurveyTitleItalic":null,"SurveyTitleBold":null,"SurveyTitleSize":null,"SurveyTitleFont":null,"BorderColor":null,"SurveyTitleColor":null,"OptionTextColor":null,"ThemeName":null,"BackgroundColor":null,"QuestionTextColor":null},{"ImagePath":null,"ThemeTemplateId":2,"BorderWidth":null,"BorderStyle":null,"OptionTextUnderline":null,"OptionTextItalic":null,"OptionTextBold":null,"OptionTextSize":null,"OptionTextFont":null,"QuestionTextUnderline":null,"QuestionTextItalic":null,"QuestionTextBold":null,"QuestionTextSize":null,"QuestionTextFont":null,"SurveyTitleUnderline":null,"SurveyTitleItalic":null,"SurveyTitleBold":null,"SurveyTitleSize":null,"SurveyTitleFont":null,"BorderColor":null,"SurveyTitleColor":null,"OptionTextColor":null,"ThemeName":null,"BackgroundColor":null,"QuestionTextColor":null}]"

///ajax function

 jQuery.ajax({
 type: "POST",
 url: "3.aspx/GetThemeList",
 data: "{'clientid':'" + -1 + "'}",
 contentType: "application/json; charset=utf-8",
 dataType: "json",
 success: function (returndata) {
 console.log(returndata);
 jQuery.each(returndata, function (index, theme) {
 alert(theme.ImagePath);
 alert(theme.ThemeTemplateId);
 });
 }
 });

but its not working for me is there any other method to read this data through jquery.

Thanks for your help.

• James Allardice: What is d in returndata? You don't show that in your example JSON. And have you specified a JSON data type or used getJSON since it doesn't look like you're parsing the string into JSON yourself?
• Jashwant: Can you show the complete ajax function ? You need to parse it if you are not setting a json datatype.
• Chakradhar: edited with complete json data and ajax function.

Answer 1

I think Its working http://jsfiddle.net/SrsxA/2/...

but in you post you missed a comma(,) for second JSON object

 [{"ImagePath":null,"ThemeTemplateId":1},{"ImagePath":null, "ThemeTemplateId":2}]
 ^-- need comma here

According to edit

d: "[{"Ima..
 ^--- you don't need `"` here and at last, don't need to wrap with `""`.

Full Working code:

var themelist = {
 d: [{
 "ImagePath": 'a',
 "ThemeTemplateId": 1,
 "BorderWidth": null,
 "BorderStyle": null,
 "OptionTextUnderline": null,
 "OptionTextItalic": null,
 "OptionTextBold": null,
 "OptionTextSize": null,
 "OptionTextFont": null,
 "QuestionTextUnderline": null,
 "QuestionTextItalic": null,
 "QuestionTextBold": null,
 "QuestionTextSize": null,
 "QuestionTextFont": null,
 "SurveyTitleUnderline": null,
 "SurveyTitleItalic": null,
 "SurveyTitleBold": null,
 "SurveyTitleSize": null,
 "SurveyTitleFont": null,
 "BorderColor": null,
 "SurveyTitleColor": null,
 "OptionTextColor": null,
 "ThemeName": null,
 "BackgroundColor": null,
 "QuestionTextColor": null},
 {
 "ImagePath": 'b',
 "ThemeTemplateId": 2,
 "BorderWidth": null,
 "BorderStyle": null,
 "OptionTextUnderline": null,
 "OptionTextItalic": null,
 "OptionTextBold": null,
 "OptionTextSize": null,
 "OptionTextFont": null,
 "QuestionTextUnderline": null,
 "QuestionTextItalic": null,
 "QuestionTextBold": null,
 "QuestionTextSize": null,
 "QuestionTextFont": null,
 "SurveyTitleUnderline": null,
 "SurveyTitleItalic": null,
 "SurveyTitleBold": null,
 "SurveyTitleSize": null,
 "SurveyTitleFont": null,
 "BorderColor": null,
 "SurveyTitleColor": null,
 "OptionTextColor": null,
 "ThemeName": null,
 "BackgroundColor": null,
 "QuestionTextColor": null}]
};
$.each(themelist.d, function(index, theme) {
 console.log(theme['ImagePath']);
 console.log(theme.ImagePath);
});

• James Allardice: Your fiddle does not contain the same code as the OP. You've missed out the var themelist = returndata.d; which may well be part of the problem.
• James Allardice: @FahimParkar - I didn't say it wasn't! That part of the answer is perfectly valid.
• Chakradhar: I missed the , in the post. Now i edited with complted json data.

Answer 2

Try this:

success: function (returndata) {
 // objectify it, if not already
 returndata = (typeof returndata == 'string') ? JSON.parse(returndata) : returndata;
 var themelist = returndata.d;
 .... // rest of your code
}

Answer 3

Im usualy use this code, working just fine. I set a data array with boolean check $data["result"] = false and the json values. If true then return json object $data["arrayfrombackendcode"]

success: function(data, textStatus, jqXHR) {
 for(var i = 0, var; var= data.arrayfrombackendcode[i]; i++) {
 data.id
 data.name
 etc
 }
},

Hope the answer helps

Answer 4

Is that really how the JSON string is encoded? seems that you opened the string with a quotation mark: " instead of an apostrophe '