CODEWITHSUNDEEP
flashactionscript-3apache-flexflex3
tomjerry
tomjerry

Reputation: 105

Flex ItemRenderer as CheckBox

I have an itemRenderer as CheckBox in a Flex DataGrid.

Now, I want to make sure that only one checkbox is selected at a time. If user select's a checkbox, and then tries to select another checkbox, previous selection should be cancelled out.

How to do in Flex ?

EDIT : 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" minWidth="955" minHeight="600">



    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.controls.CheckBox;
            import mx.controls.RadioButton;
            import mx.controls.RadioButtonGroup;

            [Bindable]
            protected var renderer:ClassFactory;

            protected function initRenderer() {
                var group:RadioButtonGroup = new RadioButtonGroup();
                var renderer = new ClassFactory(RadioButton);
                renderer.properties = {group:group};
            }

            private var arrayC:ArrayCollection = new ArrayCollection
                (
                    [
                        {fname:"Person1",isSelected:false},
                        {fname:"Person2",isSelected:false},
                        {fname:"Person3",isSelected:false}
                    ]
                );

                    // To be called when we uncheck checkbox ..
            private function unSelect(event:MouseEvent):void {

            }
        ]]>
    </mx:Script>
    <mx:DataGrid id="dg" x="400" y="400" dataProvider="{arrayC}">
        <mx:columns>
            <mx:DataGridColumn id="dgc1" itemRenderer="{renderer}"/>
            <mx:DataGridColumn id="dgc2" dataField="fname"/>
        </mx:columns>
    </mx:DataGrid>
</mx:Application>

Upvotes: 0

Views: 1069

Answers (1)

Amy Blankenship
Amy Blankenship

Reputation: 6961

Try something like this:

[Bindable]
protected var renderer:ClassFactory;

protected function initRenderer() {
   var group:RadioButtonGroup = new RadioButtonGroup();
   var renderer = new ClassFactory(RadioButton);
   renderer.properties = {group:group};
}

Bind your column's itemRenderer property to renderer.

EDIT: There was originally another answer on this post that explained that it is not really a good idea to use a check box when the functionality needed is what useres will expect from Radio Buttons. Users expect when they see check boxes that they can check more than one. http://www.useit.com/alertbox/20040927.html

Upvotes: 2

Related Questions