[英]How can i do select multiple rows ( allowMultipleSelection=“true” ) in datagrid using flex?
[英]how can i select particular checkbox within datagrid itemrenderer in flex?
我有類似隨機單擊的按鈕,如果我單擊此按鈕,則將在datagrid itemrenderer復選框內選擇15復選框,但是我無法訪問該復選框? 請轉給我? 如何訪問該復選框?
<mx:DataGridColumn headerText="1" rendererIsEditor="true" editorDataField="selected">
<mx:itemRenderer>
<mx:Component>
<mx:CheckBox textAlign="center" click="{data.check1 = (data.check1 != 'true') ? 'true' : 'false'};outerDocument.toggleCheckbox(data);outerDocument.calcValues();" dataChange="this.selected=outerDocument.validateCheckbox(data)" themeColor="#ffff00" fillAlphas="[1, 1, 0.75, 0.65]" fillColors="[#f7f7d3, #ffffff, #ff9900, #ffff00]" />
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
查看以下代碼:
Data.as
package
{
public class Data
{
[Bindable]
public var name:String;
[Bindable]
public var checked:Boolean;
public function Data(name:String, checked:Boolean)
{
this.name = name;
this.checked = checked;
}
}
}
Test.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical"
xmlns:local="*" creationComplete="create();">
<mx:Button label="Randomize" click="randomize()"/>
<mx:Button label="Trace selected indices" click="traceValues()"/>
<mx:DataGrid id="dg" width="100%" height="100%" rowCount="5"
dataProvider="{dp}">
<mx:columns>
<mx:DataGridColumn dataField="name" headerText="Name"/>
<mx:DataGridColumn headerText="Checked" dataField="checked">
<mx:itemRenderer>
<mx:Component>
<mx:CheckBox selected="{data.checked}"
change="{data.checked = this.selected;}/>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
public var dp:ArrayCollection;
public function create():void
{
var array:Array = [];
for(var i:Number = 0; i < 20; i++)
array.push(new Data("The Name", false));
dp = new ArrayCollection(array);
}
private function randomize():void
{
var selectedNumbers:Array = [];
var randomNumber:Number;
for(var i:Number = 0; i < 5; i++)
{
do
randomNumber = Math.floor(Math.random() * 20);
while(selectedNumbers.indexOf(randomNumber) != -1);
dp.getItemAt(randomNumber).checked = !dp.getItemAt(randomNumber).checked;
selectedNumbers.push(randomNumber);
}
}
private function traceValues():void
{
for(var i:Number = 0; i < 20; i++)
{
if(dp.getItemAt(i).checked)
trace(i);
}
}
]]>
</mx:Script>
</mx:Application>
從復選框的更改事件處理程序中調用outerDocument.someMethod(this)
。 這樣, someMethod(checkBox:CheckBox)
可以訪問復選框。
如果將代碼分成不同的行,而不是將所有內容都隱藏在最右端,那么閱讀代碼會更容易。
更新:
<!-- this is your DataGridColumn's itemRenderer -->
<mx:itemRenderer>
<mx:Component>
<mx:CheckBox textAlign="center" selected="{data.checked}"/>
<mx:Component>
<mx:itemRenderer>
將此添加到隨機按鈕的單擊處理程序中:
var selectedNumbers:Array = [];
var randomNumber:Number;
for(i = 0; i < 15; i++)
{
do
randomNumber = Math.floor(Math.random() * 40);
while(selectedNumbers.indexOf(randomNumber) != -1);
//dp is the data provider of the data grid
dp.getItemAt(randomNumber).checked = true;
selectedNumbers.push(randomNumber);
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.