flex中数据网格的两列共有的单选按钮组答案

【问题标题】：Radio button group common to two columns of a datagrid in flexflex中数据网格的两列共有的单选按钮组
【发布时间】：2014-01-01 10:52:01
【问题描述】：

在我的应用程序中，我有一个数据网格，其中 2 列我需要将单选按钮设置为 itemrenderer。但问题是，如果我们选择一个单选按钮，则必须取消选择下一个单选按钮。所以我想实现这一点通过为两个单选按钮使用一个公共单选组但它不起作用（两个单选按钮都是可选的）。但是我需要一个单选按钮才能被选中一次。有什么建议么... 我的代码如下

<mx:DataGridColumn headerText="Buy Offer" dataField="buyoffer">
<mx:itemRenderer>
    <fx:Component>
        <mx:HBox>
            <mx:RadioButton id="chk1"   groupName="{components.BuyRadioGroup}" horizontalCenter="0"/>
        </mx:HBox>
    </fx:Component>
</mx:itemRenderer>

<mx:DataGridColumn headerText="Get Offer" dataField="getoffer">
<mx:itemRenderer>
    <fx:Component>
        <mx:HBox>
            <mx:RadioButton id="chk2" groupName="{components.BuyRadioGroup}" horizontalCenter="0"/>
        </mx:HBox>
    </fx:Component>
</mx:itemRenderer>

【问题讨论】：

根据您显示的代码，我不明白您如何“共享”单选按钮组。你说它不工作，但没有告诉我们它是如何工作的以及为什么这与你想要的不同。这些信息对我们很有帮助。通常，使单选按钮的选定值取决于渲染器正在显示的数据对象的属性值。
嗨@Reboog711 我编辑了我的问题。我想要的是，如果一个单选按钮被选中，下一个单选按钮应该自动取消选择。

标签： apache-flex datagrid itemrenderer radio-group

【解决方案1】：

我认为公共或共享单选按钮组不是合适的解决方案。

将单个 RBG 传递给每个渲染器将导致通过更改一个项目（即网格中的行）的选择会影响其他行的行为。

相反，正如 Reboog711 建议的那样，考虑将每个单选按钮的选定值绑定到域对象的适当值。

我建议使用一个可重用的渲染器，它可以表示 Offer 的 type 的可能值。这将减少您的大部分代码重复并使更改变得非常简单。

<mx:DataGrid dataProvider="{offerList}">
    <mx:columns>
        <mx:DataGridColumn headerText="Buy Offer">
            <mx:itemRenderer>
                <mx:Component>
                    <local:OfferTypeIR offerType="{OfferType.BUY}"/>
                </mx:Component>
            </mx:itemRenderer>
        </mx:DataGridColumn>
        <mx:DataGridColumn headerText="Get Offer">
            <mx:itemRenderer>
                <mx:Component>
                    <local:OfferTypeIR offerType="{OfferType.GET}"/>
                </mx:Component>
            </mx:itemRenderer>
        </mx:DataGridColumn>
    </mx:columns>
</mx:DataGrid>

将相关属性添加到您的域对象：

public class Offer
{
    [Bindable]
    public var type : OfferType = OfferType.BUY;
}

在你的渲染器中：

<mx:HBox>

    <mx:Script>
        <![CDATA[

            [Bindable]
            public var offerType : OfferType;

            [Bindable("dataChange")]
            public function get offer() : Offer
            {
                return data as Offer;
            }

        ]]>
    </mx:Script>

    <mx:RadioButton selected="{offer.type == offerType}"
                    change="offer.type = offerType"/>

</mx:HBox>

【讨论】：