如何将行号添加到ExtJS网格？

在ExtJS GridPanel中，有没有一种方法可以设计一个列，其唯一目的是充当序列号列？此列不需要dataIndex属性。现在，我使用了一个自定义的行数函数，但这意味着行numberer是在grid.js文件中定义的，并且来自grid.ui.js的所有列都需要被复制到grid.js中。我正在使用Ext设计器。如何将行号添加到ExtJS网格？

编辑：我的问题的症结在于：有没有一种方法来定义使用Ext设计器的行numberer？

来源

2011-03-28 Victor

您所需要的只是列定义中的Ext.grid.RowNumberer。

var colModel = new Ext.grid.ColumnModel([ 
    new Ext.grid.RowNumberer(), 
    {header: "Name", width: 80, sortable: true}, 
    {header: "Code", width: 50, sortable: true}, 
    {header: "Description", width: 200, sortable: true} 
]);

来源

2011-03-29 00:09:27 wes

不是一个答案，只是想分享这个： -

在Ext.grid.RowNumberer的顶部，你可以有这个小漂亮的黑客，这将正确地增加你的号码根据您的页码查看您是否在网格中实施了PagingToolbar。

以下是我的工作示例。我扩展了原来的Ext.grid.RowNumberer以避免冲突。

Kore.ux.grid.RowNumberer = Ext.extend(Ext.grid.RowNumberer, { 
    renderer: function(v, p, record, rowIndex) { 
     if (this.rowspan) { 
      p.cellAttr = 'rowspan="'+this.rowspan+'"'; 
     } 
     var st = record.store; 
     if (st.lastOptions.params && st.lastOptions.params.start != undefined && st.lastOptions.params.limit != undefined) { 
      var page = Math.floor(st.lastOptions.params.start/st.lastOptions.params.limit); 
      var limit = st.lastOptions.params.limit; 
      return limit*page + rowIndex+1; 
     }else{ 
      return rowIndex+1; 
     } 
    } 
});

和下面的代码是从Ext.grid.RowNumberer，这对我来说，很丑陋，因为数字是固定的一切的时候，不管它是什么页码的原始renderer。下面

renderer : function(v, p, record, rowIndex){ 
    if(this.rowspan){ 
     p.cellAttr = 'rowspan="'+this.rowspan+'"'; 
    } 
    return rowIndex+1; 
}

来源

2011-03-29 07:34:49

这是好的，好答案 – JamesHalsall 2011-03-29 10:47:37

ExtJS的4.2.1工作代码：

// Row numberer correct increasing 
Ext.override(Ext.grid.RowNumberer, { 
    renderer: function(v, p, record, rowIndex) { 
     if (this.rowspan) { 
      p.cellAttr = 'rowspan="'+this.rowspan+'"'; 
     } 
     var st = record.store; 

     if (st.lastOptions.page != undefined && st.lastOptions.start != undefined && st.lastOptions.limit != undefined) { 
      var page = st.lastOptions.page - 1; 
      var limit = st.lastOptions.limit; 
      return limit*page + rowIndex+1; 
     } else { 
      return rowIndex+1; 
     } 
    } 
});

来源

2013-09-10 08:17:53

对于4.2版本非常非常简单：

只需添加一个新列如下：

{ 
    xtype: 'rownumberer', 
    width: 40, 
    sortable: false, 
    locked: true 
}

来源

2014-08-01 01:42:39 VAAA

如何将行号添加到ExtJS网格？

回答

相关问题