Apache flex datagrid中用于选择整行的单选按钮

我在Flex中有一个Datagrid。我需要在第一列中添加一个单选按钮，这样当我选择该单选按钮时，整行都应该被选中。 我已尝试使用以下代码-

<mx:DataGridColumn id="selectColumnRadioButton" sortable="false" textAlign="center" editable="false" width="18">
                         <mx:itemRenderer >
                              <mx:Component>
                                     <mx:RadioButton selected="false"/>
                                 </mx:Component>
                             </mx:itemRenderer>
              </mx:DataGridColumn>

但有以下问题： 1） 它允许我选择多个按钮。 2） 如果单击行上的任何其他位置，则该行将被选中。这不是预期的行为。仅当我选择单选按钮时，才应选择If

请帮我做这件事。：）

它允许我选择多个按钮

因为这些单选按钮是下拉项呈现器，属于不同组件中的不同单选按钮组。在父类（包含DataGrid）中编写一个方法，该方法将rowIndex作为输入并相应地选择行，并显式取消选择所有其他单选按钮。您可以使用

outerDocument.methodName（listData.rowIndex）

如果单击行上的任何其他位置，则该行将被选中。这不是预期的行为

这是

DataGrid

的默认行为-正如前面所建议的，您必须遍历DataGrid代码，找出发生选择的部分，并覆盖该方法。这种行为可能是在DataGrid的一些基类中实现的，比如

ListBase

，下面是另一个工作示例。如果不使用XML数据，则不允许使用parent（）。改用outerDocument.dg.dataProvider，其中dg是数据网格的id

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
 <mx:Script>
 <![CDATA[
 public var dp:XML = <users>
 <user>
 <name>one</name>
 <main>true</main>
 </user>
 <user>
 <name>two</name>
 <main>false</main>
 </user>
 <user>
 <name>tre</name>
 <main>false</main>
 </user>
 </users>;
 ]]>
 </mx:Script>
 <mx:VBox>
 <mx:DataGrid dataProvider="{dp.user}" width="400">
 <mx:columns>
 <mx:DataGridColumn headerText="Name" dataField="name"/>
 <mx:DataGridColumn headerText="Main">
 <mx:itemRenderer>
 <mx:Component>
 <mx:HBox horizontalAlign="center">
 <mx:Script>
 <![CDATA[
 private function changeMain(event:Event):void{
 if(data.main == 'true'){
 //nothing
 data.main = 'true';
 }else{
 for each(var u:XML in (data as XML).parent().user){
 u.main = 'false';
 }
 data.main = 'true';
 }
 }
 ]]>
 </mx:Script>
 <mx:RadioButton click="changeMain(event)"  selected="{(data.main == 'true')}"/>
 </mx:HBox>
 </mx:Component>
 </mx:itemRenderer>
 </mx:DataGridColumn>
 <mx:DataGridColumn headerText="Main value" dataField="main"/>
 </mx:columns>
 </mx:DataGrid>
 </mx:VBox>
</mx:Application>

一
真的
二
假的
特雷
假的
;
]]>

应用程序：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
private static const SELECTED:String = "SELECTED";
private static const UNSELECTED:String = "UNSELECTED";
]]>
</mx:Script>
<mx:ArrayCollection id="arr">
<mx:Object label="User 1" data="1" count="4" state="{UNSELECTED}"/>
<mx:Object label="User 2" data="2" count="4" state="{UNSELECTED}"/>
<mx:Object label="User 3" data="3" count="0" state="{UNSELECTED}"/>
<mx:Object label="User 4" data="4" count="4" state="{UNSELECTED}"/>
<mx:Object label="Open Position" data="5" count="4" state="{UNSELECTED}"/>
<mx:Object label="User 6" data="6" count="0" state="{UNSELECTED}"/>
<mx:Object label="Open Position" data="7" count="4" state="{UNSELECTED}"/>
<mx:Object label="User 8" data="8" count="0" state="{UNSELECTED}"/>
<mx:Object label="User 9" data="9" count="4" state="{UNSELECTED}"/>
<mx:Object label="Open Position" data="10" count="0" state="{UNSELECTED}"/>
<mx:Object label="User 11" data="11" count="4" state="{UNSELECTED}"/>
<mx:Object label="Open Position" data="12" count="0" state="{UNSELECTED}"/>
<mx:Object label="User 13" data="13" count="4" state="{UNSELECTED}"/>
<mx:Object label="User 14" data="14" count="0" state="{UNSELECTED}"/>
<mx:Object label="User 15" data="15" count="4" state="{UNSELECTED}"/>
<mx:Object label="User 16" data="16" count="0" state="{UNSELECTED}"/>
</mx:ArrayCollection>
        <mx:DataGrid x="161" y="197" id="dg1" verticalGridLines="false"  horizontalGridLines="true" horizontalGridLineColor="#cccccc"draggableColumns="true"  dataProvider="{arr}">
<mx:columns>
<mx:DataGridColumn headerText="Column 1" id="col1" width="150" itemRenderer="customRadio">
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Column 2" dataField="data" />
<mx:DataGridColumn headerText="Count" dataField="count"/>
</mx:columns>
</mx:DataGrid>
</mx:Application>

渲染器：

<?xml version="1.0" encoding="utf-8"?>
<mx:RadioButton xmlns:mx="http://www.adobe.com/2006/mxml" click="onRadioToggle()">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
public var isSelected:Boolean;
private static const SELECTED:String = "SELECTED";
private static const UNSELECTED:String = "UNSELECTED";
override public function set data(value:Object):void {
super.data = value;
if(value){
//value.isSelected---> isSelected is temp var in dp, which wil keep track of
//whether it selected or not
//this.selected = value.selected;
if(value.state == SELECTED){
this.selected = true;
}
else{
this.selected = false;
}
}
}
private function onRadioToggle():void{
if(data.state == UNSELECTED)
{
data.state = SELECTED;
}
else{
data.state = UNSELECTED;
}
var arrObj:ArrayCollection = Object(this.owner.parent).arr ;
if(arrObj != null){
var len:int = arrObj.length;
for(var i:int = 0 ; i < len ; i++){
if(data.data != arrObj.getItemAt(i).data)
arrObj.getItemAt(i).state = UNSELECTED
}
}
}
]]>
</mx:Script>
</mx:RadioButton>

isSelected是dp中的临时变量，它将跟踪
//无论选择与否
//this.selected=value.selected；
如果（value.state==选中）{
this.selected=true；
}
否则{
this.selected=false；
}
}
}
私有函数onRadioToggle（）：void{
如果（data.state==未选中）
{
data.state=已选择；
}
否则{
data.state=未选中；
}
var arrObj:ArrayCollection=Object（this.owner.parent）.arr；
如果（arrObj！=null）{
var len:int=arrObj.length；
对于（变量i:int=0；i

听起来您需要覆盖默认的DataGrid功能，以选择要对DataGrid进行自定义扩展的项。

<?xml version="1.0" encoding="utf-8"?>
<mx:RadioButton xmlns:mx="http://www.adobe.com/2006/mxml" click="onRadioToggle()">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
public var isSelected:Boolean;
private static const SELECTED:String = "SELECTED";
private static const UNSELECTED:String = "UNSELECTED";
override public function set data(value:Object):void {
super.data = value;
if(value){
//value.isSelected---> isSelected is temp var in dp, which wil keep track of
//whether it selected or not
//this.selected = value.selected;
if(value.state == SELECTED){
this.selected = true;
}
else{
this.selected = false;
}
}
}
private function onRadioToggle():void{
if(data.state == UNSELECTED)
{
data.state = SELECTED;
}
else{
data.state = UNSELECTED;
}
var arrObj:ArrayCollection = Object(this.owner.parent).arr ;
if(arrObj != null){
var len:int = arrObj.length;
for(var i:int = 0 ; i < len ; i++){
if(data.data != arrObj.getItemAt(i).data)
arrObj.getItemAt(i).state = UNSELECTED
}
}
}
]]>
</mx:Script>
</mx:RadioButton>