在Kendo網格的客戶端中對網格進行過濾時，如何獲取事件處理程序？

Question

我在這里創建了一個簡單的網格，當本地過濾網格時，我想重新計算一列的總和。 我不想計算列或模板，因為我想更新標簽，並且當在本地對網格進行過濾時，我還必須在頁面中執行其他操作。

var data = [
    { item: "item1", weight: 15 },
    { item: "item2", weight: 22 },
    { item: "item3", weight: 43 },
    { item: "item4", weight: 37 },
    { item: "item5", weight: 33 }
];
$("#grid").kendoGrid({
    columns: [
        { field: "item" },
        { field: "weight" }
    ],
    filterable: true,                       
    sortable: true,
    pageable: true,
    resizable:true, 
    selectable: "row",
    columnMenu: true,
    dataSource:data ,
    change: function(e) {
        var grid = e.sender;
        var selected = grid.dataItem(this.select());
        alert(selected.item);
        getSum();
    }
});
getSum();
function getSum() {
    var grid = $("#grid").data("kendoGrid");
    var data = grid.dataSource.data();
    var sum = 0;
    for ( var i = 0; i<= (data.length-1);i++)
    {
        sum = sum + data[i].weight;    
    }
    $("#weight-label").text(sum);   
}

http://jsfiddle.net/KendoDev/gb3qzgm2/

在客戶端對網格進行過濾時，如何獲取事件處理程序？

Answer 1

在計算和的函數中，應使用grid.dataSource.view()而不是grid.dataSource.data() 。

您的JSFiddle在此處修改： http : //jsfiddle.net/OnaBai/gb3qzgm2/1/

根據Kendo UI文檔： data()

返回值獲取數據源的數據項。

而view()

返回與當前頁面，過濾器，排序和組配置相對應的數據項

然后，如果你想自動更新的標簽，你可以調用getSum從電網dataBound事件處理程序，您的jsfiddle這個其他版本的： http://jsfiddle.net/OnaBai/gb3qzgm2/2/

Answer 2

我只對您的代碼做了幾處小改動，當我們可以在生成“ Kendo修訂/生成”的javascript字符串之前注入自己的自定義javascript時，這些更改可以滿足Kendo的要求：

http://jsfiddle.net/gb3qzgm2/4/

var data = [{
    item: "item1",
    weight: 15
}, {
    item: "item2",
    weight: 22
}, {
    item: "item3",
    weight: 43
}, {
    item: "item4",
    weight: 37
}, {
    item: "item5",
    weight: 33
}];
$("#grid").kendoGrid({
    columns: [{
        field: "item"
    }, {
        field: "weight"
    }],
    filterable: true,
    sortable: true,
    pageable: true,
    resizable: true,
    selectable: "row",
    columnMenu: true,
    dataSource: data,
    change: function (e) {
        var grid = e.sender;
        var selected = grid.dataItem(this.select());
        alert(selected.item);
        var s = getSum();

        $("#weight-label, .k-pager-info").text('The Sum is: ' + s);
    }
});
//getSum();

function getSum() {
    var grid = $("#grid").data("kendoGrid");
    var data = grid.dataSource.data();
    var sum = 0;
    for (var i = 0; i <= (data.length - 1); i++) {
        sum = sum + data[i].weight
    }
    return sum
}