Getting data from JSON using Javascript
So I have a json output that looks like this:
{"Result" : [
{
"Id" : "5214",
"ParentReasonId" : "0",
"Description" : "Billing & Payment",
"SysName" : "Billing & Payment",
"SysCategory" : "Billing & Payment",
"ClientId" : "924",
"DispositionCount" : "6",
"IsActive" : true,
"ChildReasonCount" : "8",
"Attributes" : [],
"SortOrder" : "0",
"CreatedBy" : null
}
]
}
And I would like to pull data for id and description from this.
jQuery("#chained_child").cascade("#chained", {
ajax: { url: 'Customhandler.ashx?List=MyList' },
template: commonTemplate,
match: commonMatch
});
function commonTemplate(item) {
return "<option Value='" + item.Result.Id + "'>"
+ item.Result.Description + "</option>";
};
But for the life of me, I can't get it to return the value I'm looking for. I know this is something noobby, but I hit the wall. Can anyone please help?
a source to share
If you are examining a JSON string, your object Result
is actually a size 1 array containing the object, not just the object. You have to remove extra parentheses or refer to your variable using:
item.Result[0].Id
To reference your variable with item.Result.Id
, you need the following JSON string:
{
"Result" :
{
"Id" : "5214",
"ParentReasonId" : "0",
"Description" : "Billing & Payment",
"SysName" : "Billing & Payment",
"SysCategory" : "Billing & Payment",
"ClientId" : "924",
"DispositionCount" : "6",
"IsActive" : true,
"ChildReasonCount" : "8",
"Attributes" : [],
"SortOrder" : "0",
"CreatedBy" : null
}
}
a source to share
As far as I can see it on the page, the argument sent to the template callback is an element from the JSON response, which is an array. Your JSON response is an object. Probably you are not sending the correct JSON response. But take that with a grain of salt as I have never used this plugin.
Anyway, if I'm right, you should answer:
[
{
"Result" :
{
"Id" : "5214",
"ParentReasonId" : "0",
"Description" : "Billing & Payment",
"SysName" : "Billing & Payment",
"SysCategory" : "Billing & Payment",
"ClientId" : "924",
"DispositionCount" : "6",
"IsActive" : true,
"ChildReasonCount" : "8",
"Attributes" : [],
"SortOrder" : "0",
"CreatedBy" : null
}
}
]
a source to share
Ionut G. Stan's answer is correct. Your json output is not the correct format for the cascading plugin.
If you don't want to change json, you can use the parameter dataFilter
in settings ajax
to increase data.
I created a working demo here: http://jsbin.com/ebohe (editable via http://jsbin.com/ebohe/edit )
Here is the relevant javascript:
$(function(){
$('#chained_child').cascade(
'#chained',
{
ajax: {
url: 'Customhandler.ashx?List=MyList',
dataFilter: extractResult
},
template: customTemplate,
match: customMatch
}
);
function extractResult(data) {
return eval('(' + data + ')').Result;
}
function customTemplate(item) {
return $('<option />')
.val(item.Id)
.text(item.Description);
}
function customMatch(selectedValue) {
return this.ParentReasonId == selectedValue;
}
});
a source to share