我通过调用web-API获取了kendo-grid DataSource的数据。排序和过滤工作。然后在我从DatePicker / Range选择中选择日期范围后,我将作为对象的范围发送到服务器,在那里我从原始JSON文件中截断所需的日期范围,并将新的裁剪json对象返回给DataSource。网格由数据正确填充,但排序/过滤停止工作。可能是什么问题和解决方案!?谢谢!
网格:
var result = $("#grid")
.kendoGrid({
dataSource: {
transport: {
read: {
url: "/api/GridData/GetCustomers",
dataType: "json"
}
},
pageSize: 20
},
height: 550,
filterable: true,
groupable: true,
sortable: true,
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},
detailTemplate: kendo.template($("#template").html()),
detailInit: detailInit
},
{
columns: [
{ field: "UniqueClientCode", title: "Уникальный код клиента" },
{ field: "ClientName", title: "Имя клиента" },
{ field: "ClientOKPO", title: "ОКПО клиента" },
{ field: "RegistrationDate", title: "Дата регистрации" },
{ field: "RemovalFromClientsDate", title: "Дата удаления из клиентов" }
]
})
.data("kendoGrid");
如何刷新网格
function refreshDatePicker () {
// Create new object with date to pass it to API controller and refresh grid
var dateForDatePicker = new Object;
dateForDatePicker.startDate = start._oldText;
dateForDatePicker.endDate = end._oldText;
$.ajax({
type: "POST",
data: dateForDatePicker,
url: "/api/GridData/postDate",
dataType: "json",
success: function (result) {
$("#grid").data("kendoGrid").dataSource = new kendo.data.DataSource({ data: result });
$("#grid").data("kendoGrid").dataSource.read();
$("#grid").data("kendoGrid").refresh();
}
});
}
$("button").on( "click", function() {
refreshDatePicker();
alert("submit clicked");
}
);
});
答案 0 :(得分:1)
使用此选项手动将dataSource设置为kendo Grid
var dataSource = new kendo.data.DataSource({
data: result
});
var grid = $("#grid").data("kendoGrid");
grid.setDataSource(dataSource);
参考:http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-setDataSource