I have a kendo grid which is reading data from a remote json file. I want that the grid columns should also be read from the same json file so that I dont have to change the client side code again and again. Whatever comes in the json file it should be capable enough to present the same data without any hard coding on client side. My json file looks like
{ "data":[
{"_type":"ProductDetails:#NWProducts","Discount":0,"OrderId":10248,"ProductId":11,"UnitPrice":14.0000,"quanity":12},{"_type":"ProductDetails:#NWProducts","Discount":0,"OrderId":10248,"ProductId":42,"UnitPrice":9.8000,"quanity":10},{"_type":"ProductDetails:#NWProducts","Discount":0,"OrderId":10248,"ProductId":72,"UnitPrice":34.8000,"quanity":5},{"_type":"ProductDetails:#NWProducts","Discount":0,"OrderId":10249,"ProductId":14,"UnitPrice":18.6000,"quanity":9}],
"columns":[
{"field":"_type","title":"Type"},{"field":"Discount","title":"Discount($)"},{"field":"OrderId","title":"Order ID"},{"field":"ProductId","title":"Product ID"},{"field":"UnitPrice","title":"Unit Price"},{"field":"quanity","title":"Quanity"}]
}
HTML code is as below
<div id="grid"></div>
JS code is below
$("#grid").kendoGrid({
title: { text: "Stats" },
sortable: false,
pageable: {
pageSizes: true,
buttonCount: 5
},
columnMenu: true,
dataSource: {
transport: {
read: {
url: "............/demo.json",
dataType: "json"
}
},
schema: {
data: "data"
}
},
columns: {
//What should be done here.
}
});
I tried the same transport read schema way to fetch the column data but it did not work. If I store the same columns json data in a variable and substitute that variable for columns then it works. Is there any way to store the columns json data as such in a variable from the json file. What is the best approach to achieve this behavior. Any help would be appreciated. Thanks in Advance.