6.7.AdvancedDataGrid数据项选择

6.7.1. 问题
我想编程实现选择AdvancedDataGrid 多个单元格
6.7.2. 问题
设置AdvancedDataGrid 的selectionMode 属性为multipleCells 和selectedCells 属性为object数组,该数组包含被选择单元格的rowIndex 和columnIndex。
6.7.3. 讨论
AdvancedDataGrid 控件对于选择单元格提供了多种选项设置。selectionMode 属性值有以下几种选择:
Multiple cells
Multiple rows
Single cell
Single row
None

要允许多个单元格被选择,allowMultipleSelection 属性也需要被设置为true。

下面的例子中,当用户选择City 列中的复选框时,该列的所有单元格都被选中。这个例子代码建立上一节的例子之上。当city 列表头的复选框被选择时,AdvancedDataGrid 发出ColumnSelectedEvent 事件,由onColumnSelect 方法处理该事件。onColumnSelect 方法构造一个object 数组,每个对象都包含被选择单元格的rowIndex 和cellIndex。这个例子选中了该列的所有单元格,最后把这个object 数组赋值给selectedCells 属性。需要注意的是,如果表格显示发生变化,则需要重新创建一个数组并赋值给selectedCells 属性。想通过
grid.selectedCells.push 方法直接添加单元格到selectedCells 属性是不行的,因为表格不会去检测数组是否发生变化。
+展开
-XML
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="verticalcreationComplete="initApp()">

<mx:HTTPService id="srvurl="assets/homesforsale.xml"
resultFormat="objectresult="onResult(event)"/>

<mx:Form>
<mx:FormItem label="City">
<mx:TextInput id="cityFilterchange="applyFilter()"/>
</mx:FormItem>
</mx:Form>
<mx:AdvancedDataGrid id="gridwidth="100%height="100%"
sortExpertMode="truedataProvider="{homesForSale}"
selectionMode="multipleCells"
creationComplete="assignListeners()">

<mx:columns>
<mx:AdvancedDataGridColumn headerText="Total No."
dataField="total"/>

<mx:AdvancedDataGridColumn headerText="City"
sortable="false"
headerRenderer="CheckBoxHeaderRenderer2dataField="city"/>

<mx:AdvancedDataGridColumn headerText="State"
dataField="state"/>

<mx:AdvancedDataGridColumn headerText="Price Ranges
[<350K] [350K -600K] [>600K]
"
dataField="range"
itemRenderer="RangeRenderer"
sortCompareFunction="sortRanges"/>

</mx:columns>
</mx:AdvancedDataGrid>
<mx:Script>
<![CDATA[
import mx.events.FlexEvent;
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
[Bindable]
private var homesForSale:ArrayCollection;
private function initApp():void {
this.srv.send();
}
private function onResult(evt:ResultEvent):void {
this.homesForSale = evt.result.data.region;
}
private function sortRanges(obj1:Object,
obj2:Object):int{
var value1:Number = obj1.range.range1;
var value2:Number = obj2.range.range1;
if(value1 < value2) {
return -1;
}
else if(value1 > value2){
return 1;
}
else {
return 0;
}
}
private function applyFilter():void {
if(this.homesForSale.filterFunction == null) {
this.homesForSale.filterFunction =
this.filterCities;
}
this.homesForSale.refresh();
}
private function filterCities(item:Object):Boolean {
var match:Boolean = true;
if(cityFilter.text != "") {
var city:String = item["city"];
var filter:String = this.cityFilter.text;
if(!city ||
city.toLowerCase().indexOf(filter.toLowerCase()) < 0) {
match = false;
}
}
return match;
}
private function assignListeners():void {
this.grid.addEventListener(ColumnSelectedEvent.COLUMN_SELECTED,
onColumnSelect);
}
private function
onColumnSelect(evt:ColumnSelectedEvent):void {
var selectedCells:Array = new Array();
var colIdx:int = evt.colIdx;
if(evt.isSelected) {
for(var i:int=0;i<this.homesForSale.length;i++) {
selectedCells.push({rowIndex:i,columnIndex:colIdx});
}
}
this.grid.selectedCells = selectedCells;
}

]]>
</mx:Script>
</mx:Application>

加支付宝好友偷能量挖...


评论(0)网络
阅读(94)喜欢(0)flash/flex/fcs/AIR