如何在ajax post回调后刷新KendoUi网格

时间:2014-02-10 02:15:08

标签: kendo-ui kendo-grid kendo-asp.net-mvc

如何在ajax帖子成功后刷新kendo ui网格? 这是我的网格ajax帖子:

 var newUser = {
                    UserId: 0,
                    UserLoginName: currentRecord.UserLoginName,
                    UserDisplayName: currentRecord.UserDisplayName
                };
                //insert selected rows using DataSource insert method
                destinationGrid.dataSource.insert(newRecord);
                //ajax post to server
                var url = '@Url.Action("CreateUser", "ManageUsers")';
                $.post(url, { loginid: currentRecord.UserLoginName, name: currentRecord.UserDisplayName, role: roleSelected }, function (result) {
                    if (result.Success) {
        **////grid is not refreshing as I want to refersh the grid again from database**
                        destinationGrid.dataSource.read();
                    }

                });
            }

3 个答案:

答案 0 :(得分:10)

这只是示例

 $.ajax({
          url: '@Url.Action("NewGridView", "Test")',
          type: "Post",
          data: { sampleItem: sampleItem, sampleCode: sampleCode, sampledescription: sampledescription },
          dataType: 'json',
          success: function (result) {

     $('#gridName').data("kendoGrid").dataSource = new kendo.data.DataSource({ data: result });
     $('#gridName').data("kendoGrid").dataSource.read();
     $('#gridName').data("kendoGrid").refresh();
}
});

<强>控制器

 public JsonResult NewGridView(string sampleItem, string sampleCode, string sampledescription)
        {

        List<SampleModel> sampleAddList = new List<SampleModel>();
        SampleModel sampleAdd = new SampleModel();
        sampleAdd.SampleCode = sampleCode;
        sampleAdd.SampleDescription = sampledescription;
        sampleAdd.SampleItems = sampleItem;

        sampleAddList.Add(sampleAdd);
        var result = sampleAddList;
       return Json(result, JsonRequestBehavior.AllowGet);
}

如果您需要在complate控制器操作完成后立即刷新网格,

$('#gridName').data("kendoGrid").dataSource = new kendo.data.DataSource({ data: result });

中的

post success

答案 1 :(得分:3)

据我了解,您需要在成功更新后刷新您的kendo网格(相当于$ .ajax success:回调)吗?

在这种情况下,kendo网格没有任何成功回调,而是使用complete回调。在传输中尝试以下操作;

dataSource: {
        transport: {
            read: {
                url: "/YourController/LoadYourGridData",
                type: "POST",
                contentType: "application/json",
                dataType: "json"
            },
            update: {
                url: "/YourController/UpdateYourGridData",
                contentType: "application/json; charset=utf-8",
                type: "POST",
                dataType: "json",
                complete: function (data) {

                    $("#Grid").data("kendoGrid").dataSource.read();

                }
            }
        }

答案 2 :(得分:1)

尝试使用

$("#gridName").data("kendoGrid").dataSource.read();

OR

$("#gridName").data("kendoGrid").refresh();