Bind kendo.data.datasource json data to kendo listview - json

Question

Category1 works but category doesn't. Both have same data. But category is a json response.
category is
{
"d": [
{"__type": "MenuData+Category", "id": 1, "name": "drinks"},
{"__type": "MenuData+Category", "id": 2, "name": "fruits"}
]
}
Do I remove the d. If so how do i do it? If not whats wrong?
<div id="categories" data-role="view" data-title="Categories">
<header data-role="header">
<div data-role="navbar">
<span data-role="view-title"></span>
</div>
</header>
<ul id="Ul1"
data-role="listview"
data-source="category" [NOTE: Changing this datasource to category1 works]
data-template="categories-template"
data-style="inset">
</ul>
</div>
<script id="categories-template" type="text/x-kendo-template">
#: name #
</script>
<script>
var app = new kendo.mobile.Application(),
category = new kendo.data.DataSource({
serverFiltering: true,
transport: {
read: {
type: "POST",
url: "http://localhost:60143/Mobile/Menu/MenuData.asmx/getCategory",
contentType: "application/json; charset=utf-8",
dataType: "json",
error: function (xhr, ajaxOptions, thrownError) {
alert("error " + xhr.responseText);
}
},
schema: {
data: "d"
},
type: "json",
parameterMap: function (options) {
return JSON.stringify(options);
}
}
}),
category1 = new kendo.data.DataSource({
data: [
{ id: 1,name: "Fruits" },
{ id: 2,name: "Drinks" },
]
});
</script>

Answer 1

You have placed schema inside transport definition while it is member of DataSource.
Try:
category = new kendo.data.DataSource({
serverFiltering: true,
transport : {
read: {
type : "POST",
url : "http://localhost:60143/Mobile/Menu/MenuData.asmx/getCategory",
contentType: "application/json; charset=utf-8",
dataType : "json",
error : function (xhr, ajaxOptions, thrownError) {
alert("error " + xhr.responseText);
}
}
},
schema : {
data: "d"
},
type : "json",
parameterMap : function (options) {
return JSON.stringify(options);
}
});