Kendo UI Grid 序列号栏答案

【问题标题】：Kendo UI Grid Serial number columnKendo UI Grid 序列号栏
【发布时间】：2013-01-11 02:59:33
【问题描述】：

我试图将剑道网格的第一列作为序列索引，它不受行记录排序的影响。有什么办法可以做到这一点？谢谢你

【问题讨论】：

标签： javascript kendo-ui kendo-grid

【解决方案1】：

您可以使用模板列来实现这一点。这是一个现场演示，展示了如何做到这一点：http://jsbin.com/olutin/10/edit

【讨论】：

我想通过分页网格来实现这一点。此答案仅在网格有一页时有效。
更新了演示以处理分页。

【解决方案2】：

脚本部分

<script>   
           var rowNumber = 0;
        function resetRowNumber(e) {
            rowNumber = 0;
        }
        function renderNumber(data) {
            return ++rowNumber;
        }
        function renderRecordNumber(data) {
            var page = parseInt($("#Role").data("kendoGrid").dataSource.page()) - 1;
            var pagesize = $("#Role").data("kendoGrid").dataSource.pageSize();
            return parseInt(rowNumber + (parseInt(page) * parseInt(pagesize)));
        } 
     </script>

  **Kendo Grid**------------------------------------------------       


  @(Html.Kendo().Grid()   
            .Name("grid")
            .Columns(columns => {
                columns.Template(t => { }).Title("Record Per page").ClientTemplate("#= renderNumber(data) #");
            columns.Template(t => { }).Title("S.No").ClientTemplate("#= renderRecordNumber(data) #"); 
                );
            })
            .Events(ev => ev.DataBound("resetRowNumber"))
        )

它将返回两列，例如每页记录 & s.no 只需使用 jquery 隐藏一列 (0)

        $(document).ready(function () {
            var grid = $("#Role").data("kendoGrid");
            grid.hideColumn(0);
        });

【讨论】：