KendoUI MVC Grid 读取后不刷新

Question

很抱歉，如果之前有人回答过这个问题，但我找不到回复，而且我是 KendoUI 的新手。

我有这个 MVC 网格：

@(Html.Kendo()
    .Grid(Model)
    .Name("grid")
    .DataSource(dataSource => dataSource
        .Ajax()
        .ServerOperation(false)
        .Read(r => r.Action("Read", "Search"))
    )
    .Resizable(resize => resize.Columns(true))
    .Selectable(selectable =>
    {
        selectable.Enabled(true);
        selectable.Mode(GridSelectionMode.Single);
    })
    .HtmlAttributes(new { style = "height: 99%;" })
    .Filterable(f => f.Mode(GridFilterMode.Row))
    .Columns(columns =>
    {
    {
        columns.Bound(c => c.DocumentType)
            .Filterable(false)
            .Width("150px")
            .Title(@Localizer["SearchTableHeaderDocumentType"]);

        columns.Bound(c => c.DocumentTypeLong)
            .Filterable(true)
            .Title(@Localizer["SearchTableHeaderDocumentTitle"])
            .Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));

        columns.Command(command =>
        {
            command.Custom(@Localizer["SearchTableOpenInD3Button"]).Click("open");
            command.Custom(@Localizer["SearchTableReadButton"]).Click("read");
            command.Custom(@Localizer["SearchTableEditButton"]).Click("edit");
        });

    })
    )

我正在使用 .ServerOperation(false)，因为我只从数据库（最多 100 条）中取回几条记录，我希望能够在本地网格中搜索这些记录。

我在页面上有一个搜索按钮：

    var search = $("#search-field").val();
    if (!search) return;
    if (search.trim() === "") return;
    var dataSource = $("#grid").data("kendoGrid").dataSource;
    var parameters = {
        searchFor: search
    }

    // call the search passing the parameters -> searchFor is the parameter name on the SearchController/Read method
    dataSource.read(parameters);

当按下按钮时，上面的 JS 读取搜索字段，调用控制器和 returns JSON 数据：

我的问题是：从我的控制器返回数据后，如何让网格重新加载？我从网格中看到等待动画 -> 一旦停止，网格为空。我假设网格会触发某个事件或其他事件？

还是我做的不对？有没有更好的方法来做到这一点？

当我第一次搜索并收到 3 个文档，然后搜索 8 个时的屏幕截图，如您所见，我从搜索中返回了 8 个文档，但只显示前 3 个？

Answer 1

这有点奇怪，因为老实说我没有发现您的代码有任何问题。

当您调用 dataSource.read() 方法时，网格应该会自动更新，您不需要做任何事情。此外，从您的屏幕截图来看，从服务器返回的数据似乎也是正确的格式（即 DataSourceResult）。设置 .ServerOperation(false) 也不是这里的问题。

一种可能的解释是返回的数据可能与您的网格数据结构不匹配；我可以从您的屏幕截图中看到返回的数据确实有 DocumentType，但它们是否也有您的网格要求的 DocumentTypeLong？确保返回的数据与传递给 Html.Kendo().Grid().

的 Model 的类型相同

Answer 2

好的，在 Telerik 的帮助下解决了这个问题 -> 问题是

.ServerOperation(false)

关于

.Grid(Model)

表示我将模型传递给 KendoUI 并告诉它不要从服务器获取任何数据

基本上我是在同时进行本地和远程数据检索 -> 我更改了对构造函数的调用以不包括模型，即 .Grid() 并且一切都运行良好！

KendoUI MVC Grid 读取后不刷新

KendoUI MVC Grid does not refresh after read

javascript

kendo-ui-grid

kendo-ui-mvc