Hi Guys,
I am writing simple application in kendoui to get json object through web service and printing it in grid. But nothing is printing except header values.
json object is:
{ "results" : [{ "name" : "Arkadiusz Pikura1", "desc" : "Pracownik 1 KS-Solab" }, { "name" : "Marcin Wita", "desc" : "Pracownik 2 KS-Solab" }] }
I am attaching code for the same.
<!DOCTYPE html>
<head>
<title>JSON Example</title>
<link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<link href="styles/kendo.common.css" rel="stylesheet" type="text/css" />
<link href="styles/kendo.default.css" rel="stylesheet" type="text/css" />
<!--Then paste the following for Kendo UI Web scripts-->
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/kendo.web.min.js" type="text/javascript"></script>
<script src="js/kendo.mobile.min.js" type="text/javascript"></script>
<!--In the header of your page, paste the following for Kendo UI Mobile styles-->
<link href="styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="main">
<div class="header">
<h1>Kendo UI Grid</h1>
</div>
<div id="grid1">
<table id="grid2">
<tr>
<th data-field="name">Name</th>
<th data-field="desc">Description</th>
</tr>
</table>
</div>
</div>
</body>
<script>
$(document).ready(function() {
$("#grid2").kendoGrid({
dataSource: {
transport: {
read: {
url: "http://dhpl.comuf.com/json.php",
dataType: "json"
}
},
schema: {
data:"results",
model: {
fields: {
desc: {},
name: {}
}
}
}
},
columns: [
{
field: "desc",
title: "results"
},
{
field: "name",
title: "results"
}
]
});
});
</script>
</html>
Please help me to figure our the problem.