Extjs之RowNumberer

Ext.grid.RowNumberer,Ext.grid.PageRowNumberer

在一个数据表格中,一般都会加一个行号,在ExtJs中,要实现行号这一效果,只需要一句代码:

 new Ext.grid.RowNumberer()

举个例子,代码如下:

var colModel = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(),{ header: "擦写机器号", width: 100, dataIndex: 'JSON_no_machine' },{ header: "写入服务器时间", width: 150, dataIndex: 'JSON_time_insert' },{ header: "现居住地址", width: 250, dataIndex: 'JSON_xjzdz' },{ header: "服务处所", width: 100, dataIndex: 'JSON_fwcs' },{ header: "擦写日期", width: 150, dataIndex: 'JSON_cxrq' },{ header: "擦写单位", width: 150, dataIndex: 'JSON_cxdwmc' },{ header: "姓名", width: 50, dataIndex: 'JSON_xm' },{ header: "身份证号码", width: 150, dataIndex: 'JSON_sfzhm' },{ header: "擦写时间", width: 150, dataIndex: 'JSON_make_time' },]);

但有些时候,我们需要的效果是实际的行号,是翻页之后,行号不会重置为1,而是从在上一页的最后一条记录的行号的基础上继续递增.这个时候,我们需要对Ext.grid.RowNumberer

进行一下扩展:

Ext.grid.PageRowNumberer = Ext.extend(Ext.grid.RowNumberer, {  width : 40,     renderer:function(value, cellmeta, record, rowIndex, columnIndex, store){  if(store.lastOptions.params!=null){  var pageindex=store.lastOptions.params.start;  return pageindex + rowIndex + 1;  } else {  return rowIndex + 1;  }  }
});

rowIndex是本页表格的行号,从0开始,pageindex取至每页的Start参数,也是从0开始,那么根据"从在上一页的最后一条记录的行号的基础上继续递增",当前记录的行号就为:

pageindex + rowIndex + 1;  

举个例子,代码如下:

                //实际行号Ext.grid.PageRowNumberer = Ext.extend(Ext.grid.RowNumberer, {width: 40,renderer: function (value, cellmeta, record, rowIndex, columnIndex, store) {if (store.lastOptions.params != null) {var pageindex = store.lastOptions.params.start;return pageindex + rowIndex + 1;} else {return rowIndex + 1;}}});var colModel = new Ext.grid.ColumnModel([// new Ext.grid.RowNumberer(),new Ext.grid.PageRowNumberer(),{ header: "擦写机器号", width: 100, dataIndex: 'JSON_no_machine' },{ header: "写入服务器时间", width: 150, dataIndex: 'JSON_time_insert' },{ header: "现居住地址", width: 250, dataIndex: 'JSON_xjzdz' },{ header: "服务处所", width: 100, dataIndex: 'JSON_fwcs' },{ header: "擦写日期", width: 150, dataIndex: 'JSON_cxrq' },{ header: "擦写单位", width: 150, dataIndex: 'JSON_cxdwmc' },{ header: "姓名", width: 50, dataIndex: 'JSON_xm' },{ header: "身份证号码", width: 150, dataIndex: 'JSON_sfzhm' },{ header: "擦写时间", width: 150, dataIndex: 'JSON_make_time' },]);

NED

转载于:https://www.cnblogs.com/Francis-YZR/p/4896021.html

Extjs之RowNumberer相关推荐

ExtJs之Ext.grid.GridPanel（部分未完）
今天在家休息,年假不用就作费啊. 看了几部香港老电影,陪爸爸看了勇士占奇才, 然后,测试了一下EXTJS未完的内容, 在京东上订了七本历史普及书,近两百块..:) 搞定. ? 1 2 3 4 5 6 ...
ExtJS实现完美Grid(2)--分组统计
我们在<ExtJS实现完美Grid(1)>的基础改造一下,让它能够实现分页面统计功能首先我们在页面要引入分组插件,因为ext-all.js不包括分组功能,可以在ext下载的examples ...
ExtJs 备忘录（6）—— GirdPanl表格（二） [ 搜索分页 ]
前言近些天对于厚积薄发有深刻的理解,尤其是月末那两天,很想再写两篇文章,保持每周一篇--每月至少四篇以上的文章.写文章分两种情况:一种情况是已经积累了许多经验,写起来轻松且得心应手,内容和系列文章容 ...
ExtJs之gridPanel的属性表格，编辑表格，表格分页，分组等技巧
这里藏的配置确实多.. 慢慢实践吧. <!DOCTYPE html> <html> <head><title>ExtJs</title>&l ...
ExtJs、ASP.net运用Linq to SQL与SQL储存过程交互
1 基本要点 1.1 Grid后台分页 1.2 Form表单提交 1.3 前台更新.删除(store.remove).增加(store.insert) 1.4 有webService.aspx.Han ...
extjs学习（关于grid）
1.想要调整某一列在表格中的顺序,可以使用mapping(索引是从0开始的) var store = new Ext.data.ArrayStore({ data:data, fields:[ {na ...
extjs 表单设置html5,ExtJS 配置和表格控件使用
ExtJS是一套完整的RIA解决方案,也因为功能完整造成了ext-all.js有400多k,由于是基于JS和CSS的功能实现,对客户端机器性能也有一定的要求,即不支持IE6以下的版本.如果您的项目对网 ...
Javascript - ExtJs - 组件 - 分页
服务端只需要返回如下格式的字符串,ExtJs就可以解析并自动生成分页数据. { totalProperty: 100 //当前查询的记录总数 root: [ { ...
ExtJs Grid分页时序号自增的实现,以及查询以后的序号的处理
ExtJs Grid分页时,默认情况下每页的序号都是从1起始的,这往往不符合我们的习惯.这里实现了序号的自动增加. 如:每页20条第一页从1开始,第二页从21条开始. 先定义一个全局变量如record ...

Extjs之RowNumberer

Extjs之RowNumberer相关推荐

最新文章

热门文章