如何将行号添加到kendo ui网格? [英] How to add row number to kendo ui grid?

问题描述

我的页面上有一个kendo ui网格，其中包含一些列. 现在，我想在其中添加一列，以显示行号. 我该怎么做? 谢谢.

I have a kendo ui grid in my page that has some columns. Now I want to add a column to it that shows me row number. How to I do this? Thanks.

推荐答案

初始化变量并将其在列中显示为template: "#= ++record #"

Initialize a variable and show it in column as template: "#= ++record #"

工作演示

这是代码:

var record = 0;

$("#grid").kendoGrid({
  dataSource: {
    data: [{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" },{ foo: "foo" }, { foo: "foo" }, { foo : "foo1" }],
    pageSize: 10
  },
  sortable: true,
  columns: [ {
    title: " ",
    template: "#= ++record #",
    width: 30
  }, { field: "foo" }],
  pageable: true,
  dataBinding: function() {
    record = (this.dataSource.page() -1) * this.dataSource.pageSize();
  }
});

这篇关于如何将行号添加到kendo ui网格?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！