给DataGrid加一个自动序列rowIndex的列

转载 2012年03月31日 22:14:34

给DataGrid加一个自动序列rowIndex的列 - 阿蔡 - 古越之地

在桌面应用程序开发的时候,我们经常会给DataGrid或者表格的第一列加上行序列号,以此给用户一个提示当前数据所在的行号,就类似于Excel的左边列。Flex的DataGrid并没有自动提供这样的属性。那么如何解决这个问题呢,方法有很多种,我们可以在DataGrid的数据源dataProvider中添加这样的行序列号,这个方法的弊端就是这个序列号和行数据(row data)绑定在一起,当DataGrid经过排序后,这个序列号就面目全非了。

删除(在这里我提供一个更加简单实用的方法。利用的就是DataGridColunm的listData属性,该属性有一个rowIndex。

效果图如上,第一列的索引(index)是独立于数据源dataProvider的,而且其他DataGridColumn的排序也不会影响第一列序号的正确性。利用下面的两行代码就能实现这一的效果。)

【编辑修改】

经过测试,发现一个bug,当数据多出现竖向滚动条时,下一屏的索引出错。

用另外一种更加直接简单的办法是用labelFunction和dataProvider数据源的获取当前索引号方法可以解决。

最新代码如下:

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">     

<mx:Script>

<![CDATA[

      import mx.events.FlexEvent;

      import mx.events.ScrollEvent;

      import mx.controls.dataGridClasses.DataGridColumn;

      import mx.collections.XMLListCollection;

      import mx.collections.ArrayCollection;

      privatevar xml:XML = <root>

            <vo region='southwest1' name='name1' id='id1' actual='111' estimate='1111'/>

            <vo region='southwest2' name='name2' id='id2' actual='222' estimate='2222'/>

            <vo region='southwest3' name='name3' id='id3' actual='333' estimate='3333'/>

            <vo region='southwest4' name='name4' id='id4' actual='444' estimate='4444'/>

            <vo region='southwest5' name='name5' id='id5' actual='555' estimate='5555'/>

            <vo region='southwest6' name='name6' id='id6' actual='666' estimate='6666'/>

            <vo region='southwest7' name='name7' id='id7' actual='777' estimate='7777'/>

            <vo region='southwest8' name='name8' id='id8' actual='888' estimate='8888'/>

            <vo region='southwest9' name='name9' id='id9' actual='999' estimate='9999'/>

            <vo region='southwest' name='name10' id='id10' actual='111' estimate='3333'/>

            <vo region='southwest' name='name11' id='id11' actual='111' estimate='3333'/>

            </root>;

      [Bindable]

      privatevar dpFlat:XMLListCollection = new XMLListCollection(xml.vo);

     

      privatefunction LabFunc(item:Object, column:DataGridColumn):String

      {

            return ((dpFlat.getItemIndex(item)+1).toString());

      }

]]>

</mx:Script>

      <mx:DataGrid id="myADG" dataProvider="{dpFlat}" horizontalScrollPolicy="auto"

      width="100%" height="100%" minWidth="500">           

      <mx:columns>

            <mx:DataGridColumn labelFunction="LabFunc" width="30" minWidth="10" sortable="false" headerText="NO." resizable="false"/>

            <mx:DataGridColumn dataField="@region" headerText="Region" />                

            <mx:DataGridColumn dataField="@name" headerText="Name"/>

            <mx:DataGridColumn dataField="@id" headerText="Id"/>

            <mx:DataGridColumn dataField="@actual" headerText="Actual"/>

            <mx:DataGridColumn dataField="@estimate" headerText="Estimate"/>                               

      </mx:columns>

</mx:DataGrid>         

</mx:Application>

源码下载 | Sample下载

----------------------------------------老的代码如下,存在bug-------------------------------------:

<?xml version="1.0"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

<mx:Script>

<![CDATA[

      import mx.controls.dataGridClasses.DataGridColumn;

      import mx.collections.XMLListCollection;

      import mx.collections.ArrayCollection;

      privatevar xml:XML = <root>

            <vo region='southwest1' name='name1' id='id1' actual='111' estimate='1111'/>

            <vo region='southwest2' name='name2' id='id2' actual='222' estimate='2222'/>

            <vo region='southwest3' name='name3' id='id3' actual='333' estimate='3333'/>

            <vo region='southwest4' name='name4' id='id4' actual='444' estimate='4444'/>

            <vo region='southwest5' name='name5' id='id5' actual='555' estimate='5555'/>

            <vo region='southwest6' name='name6' id='id6' actual='666' estimate='6666'/>

            <vo region='southwest7' name='name7' id='id7' actual='777' estimate='7777'/>

            <vo region='southwest8' name='name8' id='id8' actual='888' estimate='8888'/>

            <vo region='southwest9' name='name9' id='id9' actual='999' estimate='9999'/>

            <vo region='southwest' name='name10' id='id10' actual='111' estimate='3333'/>

            <vo region='southwest' name='name11' id='id11' actual='111' estimate='3333'/>

            </root>;

      [Bindable]

      privatevar dpFlat:XMLListCollection = new XMLListCollection(xml.vo);

     

]]>

</mx:Script>

<mx:DataGrid id="myADG" dataProvider="{dpFlat}" horizontalScrollPolicy="auto"

      width="100%" height="100%" minWidth="500">           

      <mx:columns>

            <mx:DataGridColumn width="30" minWidth="10" sortable="false" headerText="NO." resizable="false">

            <mx:itemRenderer>

            <mx:Component>

                  <mx:DataGridItemRenderer>

                  <mx:Script>

                  <![CDATA[

                        import mx.controls.dataGridClasses.DataGridListData;

                        overridepublicfunctionset data(value:Object):void{

                              super.data = value;

                              var dgListData:DataGridListData = listData as DataGridListData;

                              dgListData.label = (dgListData.rowIndex+1).toString();                                                                        }

                  ]]>

                  </mx:Script>

                  </mx:DataGridItemRenderer>

            </mx:Component>

            </mx:itemRenderer>

            </mx:DataGridColumn>

            <mx:DataGridColumn dataField="@region" headerText="Region" />                

            <mx:DataGridColumn dataField="@name" headerText="Name"/>

            <mx:DataGridColumn dataField="@id" headerText="Id"/>

            <mx:DataGridColumn dataField="@actual" headerText="Actual"/>

            <mx:DataGridColumn dataField="@estimate" headerText="Estimate"/>                               

      </mx:columns>

</mx:DataGrid>         

</mx:Application>

注意粗体的两行代码。

转载:http://wmcai.blog.163.com/blog/static/480242008111115724283/

WPF DataGrid行序号自增-技术&分享

WPF DataGrid行序号自增 构造函数t
  • jackson0714
  • jackson0714
  • 2014年05月06日 17:00
  • 2749

easyui自定义扩展,序号列宽度

easyui的datagrid,当数据量过大时(接近万条),
  • yy910308
  • yy910308
  • 2014年09月01日 17:04
  • 5011

慎用DataGrid的CurrentRowIndex操作DataTable

    在DataGrid的AllowSorting值为True的情形下,利用CurrentRowIndex来取DataTable中相应的Row是不大妥当的。    在随意中进行了某列排序后,Curr...
  • lzmtw
  • lzmtw
  • 2004年09月16日 20:15
  • 2496

Oracle中为某列加序号(测试)

某天为了做某个测试,需要在为一个表加一个序列号列,就想到了如下的方法,在此记录一下 原理: 利用oracle在创建表示产生的伪列rownum,查出该rownum以后导入到另外一个表中,本文以rec...
  • ertwewe
  • ertwewe
  • 2014年03月26日 16:46
  • 354

给 DataGrid 增加序列号的两种方法

给 DataGrid 增加序列号的两种方法 ??? 在页面显示一个 DataGrid 的时候,常常需要显示一个序列,如图所示: ??? ??? 同时根据 DataGrid 的过滤条件不同,需要也发生相...
  • xuandhu
  • xuandhu
  • 2004年12月31日 08:28
  • 1418

给DataGrid加CheckBox列并在表头添加全选、全选按钮、置零按钮

//给DataGrid列头上的CheckBox添加事件 private void dgdInfo_ItemCreated(object sender, System.Web.UI.WebControl...
  • cngkqy
  • cngkqy
  • 2007年09月27日 16:31
  • 903

如何让DataGrid自动生成序号

     在DataGrid的第一列自动生成序号,如下图:     代码实现:前台(WebForm1.aspx):序号"> 客户ID">公司名称">城市">地址">  后台(WebForm1.aspx...
  • yx10
  • yx10
  • 2005年07月08日 15:50
  • 1796

Easyui-datagrid 给标题列加上超链接(MVC3.0应用程序中)

Easyui-datagrid实现超链接列 Easyui-datagrid实现超链接列到controller中 分页查询
  • u010073895
  • u010073895
  • 2015年01月11日 17:00
  • 2336

DataGrid和GridView自动增加序号(三种实现方式)

DataGrid自动增加序号(三种实现方式) 方法一:,直接在Aspx页面DataGrid模板列中. 缺点是到第二页分页时又重新开始了.  asp:TemplateColumn Head...
  • wfh_fighting
  • wfh_fighting
  • 2016年10月08日 19:58
  • 1215

自动调整datagrid列宽(根据行、列长度比较自动调整宽度)

using System;using System.Drawing;using System.Collections;using System.ComponentModel;using System....
  • tangyong12
  • tangyong12
  • 2006年05月24日 22:08
  • 2380
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:给DataGrid加一个自动序列rowIndex的列
举报原因:
原因补充:

(最多只允许输入30个字)