jquery - 如何在 Kendo UI 网格中获得行号

Question

我在 asp.net mvc 中有剑道网格，并且使用服务器包装器。我想要名为“行号”的附加列，它是简单的计数器(1,2,3，...)。我希望这个计数器永远不会因客户端排序而改变。始终第一行为 1 第二行为 2 ，...在“RowNumber”列中

我怎样才能在剑道网格中做到这一点？

Answer 1

您可以使用dataBound事件:

$("#grid").kendoGrid({
    sortable: true,
    dataSource: [{
        name: "Jane Doe",
        age: 30
    }, {
        name: "John Doe",
        age: 33
    }],
    columns: [{
        field: "name"
    }, {
        field: "age"
    }, {
        field: "rowNumber",
        title: "Row number",
        template: "<span class='row-number'></span>"
    }],
    dataBound: function () {
        var rows = this.items();
        $(rows).each(function () {
            var index = $(this).index() + 1;
            var rowLabel = $(this).find(".row-number");
            $(rowLabel).html(index);
        });
    }
});

( demo )