json - How to bind a Kendo grid to a dynamic datatable -
i working kendo+razor , want create kendo grid not have specific data model (in case, have show results of sql query, entered user, result can have number/type of columns). make generic tried bind grid system.data.datatable , ajax call populate grid. works fine when loaded first time, when repopulate same grid, not update column names.
scenario:
ajax call made on button click populate grid query results. on first ajax call result json attributes id, name, , description. grid showed correct data 3 above mentioned columns , 4 rows.
on second ajax call response json contains attributes username, usertype, address, phonenumber, time grid not update model binding , columns remain previous 3 columns id, name, , description number of rows gets updated no data in (as columns not present in returned json)
i want rebind columns returned json attributes can differ every time.
here html code:
@model system.data.datatable <div> @(html.kendo().grid(model) .name("resultsgrid") .tablehtmlattributes(new { class = "kendogrid" }) ) </div>
and javascript on button click code:
function execute() { $.ajax({ url: "something something", type: "get", contenttype: "application/json;charset=utf-8", data: "", datatype: "json", success: function (data) { $("#resultsgrid").kendogrid({ scrollable: false, pageable: true, sortable: true, resizable: true, datasource: { data: data, pagesize: 5 } }); } }
how can refresh grid bind columns new json attributes?
you first need destroy old grid , create new one:
success: function(data) { // reference grid instance var grid = $("#resultsgrid").data("kendogrid"); // destroy grid.destroy(); $("#resultsgrid") .empty() // clear old html .kendogrid( { datasource: { data: data, pagesize: 5 } }); }
Comments
Post a Comment