当前位置: 代码迷 >> Web前端 >> DataGrid展示行号
  详细解决方案

DataGrid展示行号

热度:379   发布时间:2012-11-22 00:16:41.0
DataGrid显示行号
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
	<mx:DataGrid  dataProvider="{ac}" id="dg" rowCount="15">
		<mx:columns>
			<mx:DataGridColumn headerText="ddd" dataField="col1"  labelFunction="rowNum" sortable="false"  textAlign="center"  width="48" backgroundColor="#B6BDD2"/>
			<mx:DataGridColumn headerText="Column 2" dataField="col2"/>
			<mx:DataGridColumn headerText="Column 3" dataField="col3"/>
		</mx:columns>
	</mx:DataGrid>
	<mx:Script>
		<![CDATA[
			import mx.controls.dataGridClasses.DataGridColumn;
			import mx.collections.ArrayCollection;
			[Bindable]
			public var ac:ArrayCollection=new ArrayCollection([
			{col1:"222",col2:"2",col3:"asdas"},
			{col1:"1",col2:"3",col3:"asdas"},
			{col1:"3",col2:"2",col3:"ascdas"},
			{col1:"dc",col2:"4",col3:"asdas"},
			{col1:"r5",col2:"5",col3:"ascdas"},
			{col1:"56",col2:"33",col3:"asdas"},
			{col1:"34",col2:"22",col3:"asdas"},
			{col1:"76",col2:"33",col3:"ascddas"},
			{col1:"62",col2:"53",col3:"sdkas"},
			{col1:"89",col2:"65",col3:"sdas"},
			{col1:"90",col2:"77",col3:"smdas"},
			{col1:"98",col2:"66",col3:"sydas"}
			]);
			/**
			 * 返回此item的行号
			 * 
			 */
			public function rowNum(item:Object,column:DataGridColumn):String{
			       var iIndex:int = ac.getItemIndex(item) + 1;
    			        return String(iIndex);
			}
		]]>
	</mx:Script>
</mx:Application>

?

思路:重写labelFunction函数,此函数包含此行的item,在datagrid的数据源中找到该item的索引位置,索引位置加一就是行号了。

1 楼 bjwulin 2010-09-10  
这种写法不好,建议用itemrenderer。
2 楼 yunzhongxia 2010-09-11  
bjwulin 写道
这种写法不好,建议用itemrenderer。

你说的不错,如果用外部渲染器比较好,外部渲染器可以重用。
  相关解决方案