I have a problem binding Kendo GRID to ASP.NET asmx web service.
Following is HTML Code
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="styles/kendo.common.min.css" />
<link rel="stylesheet" href="styles/kendo.default.min.css" />
<link rel="stylesheet" href="styles/kendo.dataviz.min.css" />
<link rel="stylesheet" href="styles/kendo.dataviz.default.min.css" />
<link href="styles/kendo.common-bootstrap.min.css" rel="stylesheet" />
<link href="styles/kendo.bootstrap.min.css" rel="stylesheet" />
<link href="../BOOTSTRAP/bootstrap.min.css" rel="stylesheet" />
<script src="../Scripts/jquery-2.0.3.min.js"></script>
<script src="js/kendo.all.min.js"></script>
<script src="../BOOTSTRAP/bootstrap.min.js"></script>
</head>
<body>
<div id="example">
<div id="grid" class="table table-bordered"></div>
<script>
$(document).ready(function () {
$("#grid").kendoGrid({
columns: [
{ field: "srno", title: "SRNO" },
{ field: "party", title: "PARTY" }
],
dataSource: new kendo.data.DataSource({
transport: {
read: {
url: "../Service/DatabaseHandling.asmx/GetPurchaseJangad_JSON",
dataType: "json",
contentType: "application/json; charset=utf-8"
}
}
}),
schema: {
data: "d"
},
sortable: true
});
});
</script>
</div>
</body>
</html>
JSON returned from service is looking ok as below.
{"d":"[{\"srno\":17,\"party\":\"PARESH\",\"dt\":\"11/5/2015\",\"weight\":15000.0,\"timestamp\":\"2015-05-11T20:19:55.093\"},{\"srno\":18,\"party\":\"SIM\",\"dt\":\"11/5/2015\",\"weight\":11000.0,\"timestamp\":\"2015-05-11T20:21:44.177\"}]"}
Still nothing is visible on GRID. And no error in browser console.
I think the issue is with the JSON data only.
Modified JSON given below, replaced \" with " and removed the quote just before and after the square brackets
{"d":[{"srno":17,"party":"PARESH","dt":"11/5/2015","weight":15000.0,"timestamp":"2015-05-11T20:19:55.093"},{"srno":18,"party":"SIM","dt":"11/5/2015","weight":11000.0,"timestamp":"2015-05-11T20:21:44.177"}]}