Question

我正在使用远程数据处理kendo网格，目前在更新网格时，我使用dataItem.set（）方法手动将网格与数据同步。这很好，但不幸的是页脚中的聚合不会刷新。它们只在调用dataSource.fetch（）时刷新，这会挂起应用程序大约10秒钟。然而，用户希望更多类似excel的响应，他们所做的每一项更改都会立即反映在总数中，但也会持久保存到数据库中。这可能使用kendo api吗？或者我必须使用jQuery手动执行此操作吗？

修改：看起来没有内置方式，所以我手动修复了j / jQuery。

编辑2 ：这是我使用的代码，稍微概括一下，并解决了一些应用程序特定的怪癖。

Kendo网格配置：

$(gridId).kendoGrid({
    columns: [
        {
            field: fieldToUpdate,
            editor: customEditor,
            //add 'data-field' attribute to footer/group footer
            footerAttributes: { 'data-field': fieldToUpdate },
            groupFooterAttributes: { 'data-field': fieldToUpdate }
        },
        //other fields...
    ],
    //other config...
});

自定义编辑器：

function customEditor(data) {
    //store original and new value
    //append textbox
    //call custom update passing td and data w/ original/new values
}

查找受影响的聚合单元格

//Gets all affected aggregate cells after an update
function getTotalsCells($container, updatedField) {
    var groups = $('#grid').data('kendoGrid').dataSource.group(),
        $totals = $('.k-footer-template>td[data-field="' + updatedField + '"]'),
        $row = $container.parent('tr');
    for (var i = 0; i < groups.length; i++) {
        var $groupTotal = $row.nextAll('.k-group-footer')
                              .eq(i)
                              .find('[data-field="..."]');
        $totals = $totals.add($groupTotal);
    }
    return $totals;
}

更新总计

$.fn.updateTotal = function (delta) {
    this.each(function () {
        var $container = $(this);
        var origTotal = parseFloat($container.text() || 0);
        var total = origTotal + delta;
        $container.text(total);
    });
};

自定义更新：

function updateGrid($container, data) {
    var difference, field;
    //get difference and updatedField
    var $totals = getTotalsCells($container);
    $totals.updateTotal(difference);
}

我觉得必须有更好的方法来做到这一点，但聚合模型似乎并没有更新。

Answer 1

我的解决方案是定义一个手动计算结果的函数，并在页脚模板中调用它。每当网格刷新时，页脚也会更新。

客户端模板：#: sumDebits() #

function sumDebits() {
    var $grid = $('#GridId');
    var kendo = $grid.data().kendoGrid;
    var data = kendo.dataSource.data();
    var total = 0;

    for (var i = 0; i < data.length; i++) {
        var debit = parseFloat(data[i].Form.debit);

        if (debit == NaN) {
            debit = 0;
        }

        total = total + debit;
    }

    return total;
}

Answer 2

我有差不多的问题。我有一个KendoGrid，我只需要刷新行（更新HTML和数据）并在模式关闭后更新groupFooterTemplateand和footerTemplate（它具有我需要更新到网格的编辑单元格）。我有“ @ progress / kendo-ui”：“ ^ 2019.2.626”。我知道这是使用集，但在此版本中，集会更新所有内容。

下面是在代码中更新groupFooterTemplate和，footerTemplate，Html（row）的代码，并且还更新了excel，而没有网格的总刷新。

let grid = $('#grid').getKendoGrid(); // Kendo Grid
let dataItem = grid.dataItem(tr); // tr: JQuery (selected Row)
let index= grid.items().index(grid.select()); // or the selected Row

dataItem = data.length > 0 && data.length === 1 ? data : dataItem; // data is the new item with the same properties as the item datasource of the Grid. You can update all properties like below or just set one property.
dataItem.dirty = true;
let rowItem = grid.dataSource.at(index);
for (let [key, value] of Object.entries(dataItem )) {
    rowItem.set(key, value); //

}

Answer 3

var grid = $("#gridName").data('kendoGrid'); 
var aggregateSum = grid.dataSource._aggregateResult;
//below code give you current aggregate value. 
var sum = aggregateSum.<your_aggregate_columnname_here>.sum; 
//assuming my Grid Column name is 'Amount' 
var sum = aggregateSum.Amount.sum;

要在不刷新页面或不获取 datasource 的情况下更改聚合值，请按照以下步骤操作

// Set the current aggregate value to 0
aggregateSum.<your_aggregate_columnname_here>.sum = 0; 
//  i.e. aggregateSum.Amount.sum = 0;

// Loop trough Grid data row by row
var gridData = grid.dataSource.data();
for (var i = 0; i < gridData.length; i++) {
    var dataRow = gridData[i];
   // to set the aggregate sum value
   aggregateSum.Amount.sum += value;
   // to set the cell value for that particular row
   dataRow.set(ColumnName, value);
}

注意：确保在更新总和后最后调用 Set() 函数。如果您在设置聚合总和之前调用 Set 函数，您将无法看到最后一次迭代的变化，因为这些变化只会在 set() 函数执行后才会体现

如何在不刷新的情况下更新Kendo网格聚合

3 个答案: