范围刷新+部分刷新+ Kendo Datasource + Kendo Grid + WebSync

Question

我们一直在实施一个具有以下技术的网站。

客户端： Html5，KendoUI，WebSync(发布，订阅)

服务器： ASP.net MVC 3.0

网格对每一行都有特定的操作。例如，我们需要在选择特定行中的复选框后单击“操作”菜单来更新每一行的状态。

当我们在菜单上执行此操作时，我们将ajax请求发送给MVC Controller以更新数据库中的记录，它只会返回true到client.Here，我们使用WebSync publisher-订户模型在请求完成时实际通知客户端，因为这些操作有时需要处理。

当我们从Web 获得回调时，我们将按如下方式更新kendo数据网格。

onMoveActionMessageReceived = function (data) {

     $("#resultGrid").data("kendoGrid").dataSource.read();
     WebSyncClient.UnsubscribeToMoveTransactionActions($('#moveTransactionIdTxt').val());
 }

由于数据库中有超过400 k的网格数据记录，并且我们使用分页方式，这种解决方案是一种耗时的解决方案，它会影响用户体验。

是否使用给定的数据项(ie.not总数据源)刷新kendo数据源。(网格范围更新)？或者还有其他的解决方案？

Answer 1

我在Kendo + WebSync中找到了一个范围更新的解决方案。在服务器中完成进程后，refreshSearchData webSync通知负责更新客户端数据源的函数。getSearchResultViewItem函数从数据库返回数据项，我已经从客户端更新了数据源。

 refreshSearchData = function (entityId, entityType) {

    getSearchResultViewItem(entityId, entityType, function (data) {

        var kendoGrid = $("#resultGrid").data("kendoGrid");

        if (kendoGrid) {
            if ($('#SelectedTypeId')[0].value == entityType) {
               var items = kendoGrid.dataSource.data().toJSON();

                for (var i = 0; i < items.length; i++) {
                    if (items[i].Id == data.Id) {
                        items[i] = data;
                        break;
                    }
                }
                kendoGrid.dataSource.data(items);
            }
        }
    });

};

getSearchResultViewItem = function (entityId, entityType, callback) {
    $.get(baseUrl + 'Search/GetSearchViewDtoById', { id: entityId, searchTypeId: entityId }, function (data) {
        callback(data);
    });
};