20 Replies Latest reply on Jul 23, 2009 10:51 PM by *Prashant Shelke*

    Unable to select 2 Radio Buttons in different columns in a DataGrid.

    GG_81

      Hi,

           I have successfully drawn 2 colums of radio buttons by using itemrenderer. But i'm unable select 2 radiobuttons simultaneously from both the colums.

      Here i'm attaching the screen shot of the application. From the screen shot let me explain to u wht exactly my problem is....

       

       

      radio_image.JPG

       

      if i select Help radio button from the first row, then i want to select start button from the second row while the Help button from first row still remains selected; but i'm unable to do i.e, focus moves

       

      In short Help Option radio buttons & Start radio buttons should be under two separate radio groups.

       

      Thanxs

       

      Gaurav

        • 1. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
          *Prashant Shelke* Level 4

          Hi, actually your is problem is related with radioButton group, all radio buttons in one column act as a radioButtonGroup, so one radio button in one column will be active at a time.


          So do one thing, create two boolean fields in Object of dataProvider say flag1 & flag2 on click of Start radio button item renderer,


          <mx:RadioButton selected="{data.flag1}" click="data.flag1= !data.flag1 ; data.flag2 = !data.flag1" /> // Start

          <mx:RadioButton selected="{data.flag2}" click="data.flag2= !data.flag2 ; data.flag1 = !data.flag2" /> // Help


          this will work for u.


          • 2. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
            GG_81 Level 1

            Hi Prashant,

                               i'm pasting my source code snippet as its not working at my end. Please go thru my snippet and help me.

             

             

            <mx:XMLList id="appConfy">
                <screens>
                    <screenname>Screen 1</screenname>
                    <flag2>true</flag2>
                    <flag1>false</flag1>
                    <provision>true</provision>
                   
                </screens>
                <screens>
                    <screenname>Screen 2</screenname>
                    <flag2>false</flag2>
                    <flag1>false</flag1>
                    <provision>true</provision>
                   
                </screens>
                <screens>
                    <screenname>Screen 3</screenname>
                    <flag2>false</flag2>
                    <flag1>false</flag1>
                    <provision>true</provision>
                   
                </screens>
                <screens>
                    <screenname>Screen 4</screenname>
                    <flag2>false</flag2>
                    <flag1>false</flag1>
                    <provision>true</provision>
                   
                </screens>
            </mx:XMLList>

             

            ***********************************RADIO BUTTON INTO DATA GRID SNIPPET**************************************

             

            <mx:DataGridColumn dataField="flag2" headerText="Help Option" width="8" paddingLeft="5" >
                                <mx:itemRenderer>
                                    <mx:Component>
                                        <mx:RadioButton selected="{data.flag2}" click="data.flag2= !data.flag2 ; data.flag1 = !data.flag2" />
                                    </mx:Component>
                                </mx:itemRenderer>
                            </mx:DataGridColumn>   
                            <mx:DataGridColumn dataField="flag1" headerText="Start Option" width="8" paddingLeft="5">
                                <mx:itemRenderer>
                                    <mx:Component>
                                        <mx:RadioButton selected="{data.flag1}" click="data.flag1= !data.flag1 ; data.flag2 = !data.flag1" />
                                    </mx:Component>
                                </mx:itemRenderer>
                            </mx:DataGridColumn>

             

             

            Thanxs

             

            Gaurav

            • 3. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
              *Prashant Shelke* Level 4

              Try this one:


              <?xml version="1.0" encoding="utf-8"?>
              <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init();">
                  <mx:Script>
                      <![CDATA[
                          import mx.controls.Alert;
                          import mx.events.ListEvent;
                          import mx.events.FlexEvent;
                          import mx.utils.ObjectUtil;
                          import mx.collections.ArrayCollection;

               


                          public function init():void
                          {
                              dg.dataProvider = new ArrayCollection();
                              var object:Object = new Object();
                              object.flag1 = false;
                              object.flag2 = false;
                             
                              dg.dataProvider.addItem(object);
                              dg.dataProvider.addItem(ObjectUtil.copy(object));
                          }
                         
                          public function setRadioValues(event:ListEvent):void
                          {
                              for(var cntRows:int = 0; cntRows < dg.dataProvider.length; cntRows++)
                              {
                                  switch(event.columnIndex)
                                  {
                                      case 0 :
                                      {
                                          dg.selectedItem.flag1 = true;
                                          dg.selectedItem.flag2 = false;
                                          dg.dataProvider.refresh();
                                          break;
                                      }
                                      case 1 :
                                      {
                                          dg.selectedItem.flag1 = false;
                                          dg.selectedItem.flag2 = true;
                                          dg.dataProvider.refresh();
                                          break;
                                      }
                                      default: break;
                                  }
                              }
                          }
                      ]]>
                  </mx:Script>
                  <mx:DataGrid id="dg" width="200" height="100" x="498" y="285" itemClick="setRadioValues(event);">
                      <mx:columns>
                          <mx:DataGridColumn dataField="flag1" headerText="Help Option" width="8" paddingLeft="5" >
                              <mx:itemRenderer>
                                  <mx:Component>
                                         <mx:HBox>
                                             <mx:RadioButton id="rdBtnHelp" label="Help " selected="{data.flag1}" />
                                         </mx:HBox>
                                  </mx:Component>
                              </mx:itemRenderer>
                          </mx:DataGridColumn>  
                          <mx:DataGridColumn dataField="flag2" headerText="Start Option" width="8" paddingLeft="5">
                              <mx:itemRenderer>
                                  <mx:Component>
                                      <mx:HBox>
                                          <mx:RadioButton id="rdBtnStart" label="Start " selected="{data.flag2}" />   
                                      </mx:HBox>
                                  </mx:Component>
                              </mx:itemRenderer>
                          </mx:DataGridColumn>       
                      </mx:columns>
                  </mx:DataGrid>
                 
              </mx:Application>

              • 4. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                GG_81 Level 1

                Hi Prashant,

                                  Thanxs for the reply. Your standalone code is working fine but when i integrated into my code it's not working. So, i'm attaching my source code file and the resources as a rar file. Please look into into this.

                 

                 

                Thanxs

                 

                Gaurav

                • 5. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                  GG_81 Level 1

                  Rar is not attaching. so i'm attaching my source code. please send the corrected file to my e-mail id - gaba.gaurav@gmail.com

                   

                   

                  Thanxs

                   

                  Gaurav

                  • 6. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                    *Prashant Shelke* Level 4

                    You have given column index wrong as 0 & 1 in switch, it should be 1 & 2 as your radio buttons lies in 1 & 2 column not in 0th & 1st


                    • 7. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                      GG_81 Level 1

                      Thanks..i'm uploading my new code. can u please run it as its giving problem in screenname datafield as i'm unable to see the screen names as well as only 2 row are visible..

                       

                       

                       

                       

                      Regards

                       

                      Gaurav

                      • 8. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                        GG_81 Level 1

                        Hi,

                            I have done changes in the code, its working fine but showing 2 extra rows without data. I'm attaching the code, please go through the code or run it.

                         

                         

                        Thanxs

                         

                        Gaurav

                        • 9. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                          *Prashant Shelke* Level 4

                          Comment out your code in init() & set false values to flag 1 & flag 2 in your XML.

                          • 10. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                            GG_81 Level 1

                            Hi,

                                I have done changes, which u told me just now, now the all the radio buttons are by default coming selected as well as add row functionality stopped working.

                             

                            I'm attaching the updated code.

                             

                             

                            Thanxs

                             

                            Gaurav

                            • 11. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                              GG_81 Level 1

                              Hi,

                                  I have done changes, which u told me just now, now the all the radio buttons are by default coming selected as well as add row functionality stopped working.

                               

                              I'm attaching the updated code.

                               

                               

                              Thanxs

                               

                              Gaurav

                              • 12. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                                *Prashant Shelke* Level 4

                                XML list .addItem is not present you need to add new item as


                                var object:Object = new Object(); // on  this object set all properties...

                                dg.dataProvider.addItem(object)

                                • 13. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                                  GG_81 Level 1

                                  Hi,

                                      Its not working. Also all radio buttons are coming selected. Can u please check the complete code and do the modification where it is required and send me the code file.

                                   

                                   

                                  Thanxs

                                   

                                  Gaurav

                                  • 14. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                                    GG_81 Level 1

                                    Hi Prashant,

                                                        Please reply as my work got stuck...

                                     

                                     

                                    Thanxs

                                     

                                    Gaurav

                                    • 15. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                                      *Prashant Shelke* Level 4

                                      Hi,


                                      actually you need to get rid of this code


                                      private function handleAddRow(event:MouseEvent):void
                                                  {
                                                      appConfy.addItem(
                                                          {
                                                              "screenname": "Screen " + dg.dataProvider.length,
                                                              "flag1": "",
                                                              "flag2": "",
                                                              "provision":""
                                                          }
                                                      );

                                                  }


                                      & add here code which I have given for Object & its property.

                                      • 16. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                                        GG_81 Level 1

                                        No success..

                                         

                                        Pasting the whole code to u after the modification which i made told by u. All radio buttons are coming selected as well as addition of row issue. I'm really thankful to u as u r helping me alot. Please help me so tht my this issue get resolved.

                                         

                                        <?xml version="1.0" encoding="utf-8"?>
                                        <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%">

                                         

                                        <mx:Script>
                                                <![CDATA[
                                                    import mx.binding.utils.BindingUtils;
                                                    import mx.controls.Alert;
                                                    import mx.events.ListEvent;
                                                    import mx.events.FlexEvent;
                                                    import mx.utils.ObjectUtil;
                                                    import mx.collections.ArrayCollection;

                                         

                                                    
                                                    

                                         


                                        //            public function init():void
                                        //            {
                                        //                dg.dataProvider = new ArrayCollection();
                                        //                var object:Object = new Object();
                                        //                object.flag1 = false;
                                        //                object.flag2 = false;
                                        //              
                                        //                dg.dataProvider.addItem(object);
                                        //                dg.dataProvider.addItem(ObjectUtil.copy(object));
                                        //            }
                                                  
                                                    public function setRadioValues(event:ListEvent):void
                                                    {
                                                        for(var cntRows:int = 0; cntRows < dg.dataProvider.length; cntRows++)
                                                        {
                                                            switch(event.columnIndex)
                                                            {
                                                                case 1 :
                                                                {
                                                                    dg.selectedItem.flag1 = true;
                                                                    dg.selectedItem.flag2 = false;
                                                                    dg.dataProvider.refresh();
                                                                    break;
                                                                }
                                                                case 2 :
                                                                {
                                                                    dg.selectedItem.flag1 = false;
                                                                    dg.selectedItem.flag2 = true;
                                                                    dg.dataProvider.refresh();
                                                                    break;
                                                                }
                                                                default: break;
                                                            }
                                                        }
                                                    }
                                                   
                                                    private function handleUpdateComplete(e:Event):void
                                                    {
                                                        var currLen:uint = dg.dataProvider.length;
                                                        dg.scrollToIndex(currLen);
                                                    }
                                                   
                                                    private function handleAddRow(event:MouseEvent):void
                                                    {
                                                        var object:Object = new Object(); // on  this object set all properties...

                                         

                                                        dg.dataProvider.addItem(object)
                                                    }
                                                ]]>
                                            </mx:Script>

                                         

                                        <mx:XMLList id="appConfy">
                                            <screens>
                                                <screenname>Screen 1</screenname>
                                                <flag1>false</flag1>
                                                <flag2>false</flag2>
                                                <provision>true</provision>
                                            </screens>
                                            <screens>
                                                <screenname>Screen 2</screenname>
                                                <flag1>false</flag1>
                                                <flag2>false</flag2>
                                                <provision>true</provision>
                                               
                                            </screens>
                                            <screens>
                                                <screenname>Screen 3</screenname>
                                                <flag1>false</flag1>
                                                <flag2>false</flag2>
                                                <provision>true</provision>
                                               
                                            </screens>
                                            <screens>
                                                <screenname>Screen 4</screenname>
                                                <flag1>false</flag1>
                                                <flag2>false</flag2>
                                                <provision>true</provision>
                                               
                                            </screens>
                                        </mx:XMLList>

                                         

                                        <!-- Validation Checking -->
                                           
                                            <mx:StringValidator source="{appId}" property="text" minLength="4" maxLength="20"/>
                                            <mx:StringValidator source="{author}" property="text"/>
                                            <mx:StringValidator source="{catgry}" property="text"/>
                                            <mx:StringValidator source="{appdspname}" property="text"/>
                                            <mx:StringValidator source="{nme}" property="text"/>
                                            <mx:StringValidator source="{tag}" property="text"/>
                                            <mx:StringValidator source="{unstalmsg}" property="text"/>
                                            <mx:StringValidator source="{iconid}" property="text"/>
                                            <mx:StringValidator source="{ver}" property="text"/>

                                         

                                        <mx:ApplicationControlBar width="100%" dock="true" paddingLeft="30" paddingTop="10">
                                            <mx:Spacer width="2%"/>
                                            <mx:LinkButton icon="@Embed(source='../resources/info.png')" toolTip="Info" id="infoLnk"/>
                                            <mx:Spacer width="75%"/>
                                            <mx:Label text="Logged in as &lt;UserName&gt;" enabled="true"/>
                                            <mx:LinkButton label="Sign out" enabled="true"/>
                                        </mx:ApplicationControlBar>
                                        <mx:Panel id="rootPanel" width="70%" height="70%" title="Application Configuration" letterSpacing="2" fontFamily="Arial" paddingLeft="20" paddingTop="20">
                                            <mx:HBox width="100%" height="100%">
                                                <mx:Form>
                                                    <mx:FormItem label="Application Id: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                    <mx:TextInput id="appId" width="100%"/>   
                                                    </mx:FormItem>
                                                    <mx:Spacer height="10"/>
                                                    <mx:FormItem label="Author: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                        <mx:TextInput id="author" width="100%"/>
                                                    </mx:FormItem>
                                                    <mx:Spacer height="10"/>
                                                    <mx:FormItem label="Category: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                        <mx:TextInput id="catgry" width="100%"/>
                                                    </mx:FormItem>
                                                    <mx:Spacer height="10"/>
                                                    <mx:FormItem label="App Display Name: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                        <mx:TextInput id="appdspname" width="100%"/>
                                                    </mx:FormItem>
                                                    <mx:Spacer height="10"/>
                                                    <mx:FormItem label="Name: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                        <mx:TextInput id="nme" width="100%"/>
                                                    </mx:FormItem>
                                                    <mx:Spacer height="10"/>
                                                    <mx:FormItem label="Tags: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                        <mx:TextInput id="tag" width="100%"/>
                                                    </mx:FormItem>
                                                    <mx:Spacer height="10"/>
                                                    <mx:FormItem label="UninstallMsg: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                        <mx:TextInput id="unstalmsg" width="100%"/>
                                                    </mx:FormItem>
                                                    <mx:Spacer height="10"/>
                                                    <mx:FormItem label="Icon Id: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                        <mx:TextInput id="iconid" width="100%"/>
                                                    </mx:FormItem>
                                                    <mx:Spacer height="10"/>
                                                    <mx:FormItem label="Version: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                        <mx:TextInput id="ver" width="100%"/>
                                                    </mx:FormItem>
                                                   
                                                </mx:Form>
                                                <mx:Spacer width="50"/>
                                                <mx:DataGrid id="dg" width="100%" dataProvider="{appConfy}" wordWrap="true" itemClick="setRadioValues(event);" updateComplete="handleUpdateComplete(event)">
                                                    <mx:columns>
                                                        <mx:DataGridColumn dataField="screenname" headerText="Screen Name" width="8" wordWrap=""/>
                                                        <mx:DataGridColumn dataField="flag1" headerText="Help Option" width="8" paddingLeft="5" >
                                                        <mx:itemRenderer>
                                                            <mx:Component>
                                                                   <mx:HBox>
                                                                       <mx:RadioButton id="rdBtnHelp" label="Help " selected="{data.flag1}" />
                                                                   </mx:HBox>
                                                            </mx:Component>
                                                        </mx:itemRenderer>
                                                    </mx:DataGridColumn> 
                                                    <mx:DataGridColumn dataField="flag2" headerText="Start Option" width="8" paddingLeft="5">
                                                        <mx:itemRenderer>
                                                            <mx:Component>
                                                                <mx:HBox>
                                                                    <mx:RadioButton id="rdBtnStart" label="Start " selected="{data.flag2}" />  
                                                                </mx:HBox>
                                                            </mx:Component>
                                                        </mx:itemRenderer>
                                                    </mx:DataGridColumn>      
                                                        <mx:DataGridColumn dataField="provision" headerText="" width="8" paddingLeft="5">
                                                            <mx:itemRenderer>
                                                                <mx:Component>
                                                                    <mx:HBox>
                                                                    <mx:Spacer width="5%"/>
                                                                    <mx:LinkButton icon="@Embed(source='../resources/new_page.png')" toolTip="Edit"/>
                                                                    <mx:Spacer width="7%"/>
                                                                    <mx:LinkButton icon="@Embed(source='../resources/delete.png')" toolTip="Dlink"/>
                                                                    </mx:HBox>
                                                                </mx:Component>
                                                            </mx:itemRenderer>
                                                        </mx:DataGridColumn>
                                                       
                                                    </mx:columns>
                                                </mx:DataGrid>
                                                <mx:LinkButton icon="@Embed(source='../resources/add.png')" toolTip="Add Screen" id="newScreenLnk" paddingTop="5" click="handleAddRow(event)" />
                                               
                                               
                                            </mx:HBox>
                                           
                                            <mx:HBox width="100%" paddingBottom="20">
                                                <mx:Spacer width="55%"/>
                                                <mx:Button id="provApp" label="Save and Provision"/>
                                                <mx:Button id="save" label="Save"/>
                                                <mx:Button id="del" label="Delete Application"/>
                                                <mx:Button id="cancel" label="Cancel"/>
                                               
                                            </mx:HBox>
                                        </mx:Panel>
                                        </mx:Application>

                                         

                                         

                                         

                                        Thanxs

                                         

                                        Gaurav

                                        • 17. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                                          *Prashant Shelke* Level 4

                                          Modified some code, now see:


                                          <?xml version="1.0" encoding="utf-8"?>
                                          <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%">



                                          <mx:Script>
                                                  <![CDATA[
                                                      import mx.binding.utils.BindingUtils;
                                                      import mx.controls.Alert;
                                                      import mx.events.ListEvent;
                                                      import mx.events.FlexEvent;
                                                      import mx.utils.ObjectUtil;
                                                      import mx.collections.ArrayCollection;



                                          //            public function init():void
                                          //            {
                                          //                dg.dataProvider = new ArrayCollection();
                                          //                var object:Object = new Object();
                                          //                object.flag1 = false;
                                          //                object.flag2 = false;
                                          //             
                                          //                dg.dataProvider.addItem(object);
                                          //                dg.dataProvider.addItem(ObjectUtil.copy(object));
                                          //            }
                                                   
                                                      public function setRadioValues(event:ListEvent):void
                                                      {
                                                          switch(event.columnIndex)
                                                          {
                                                              case 1 :
                                                              {
                                                                  dg.selectedItem.flag1 = 1;
                                                                  dg.selectedItem.flag2 = 0;
                                                                  dg.dataProvider.refresh();
                                                                  break;
                                                              }
                                                              case 2 :
                                                              {
                                                                  dg.selectedItem.flag1 = 0;
                                                                  dg.selectedItem.flag2 = 1;
                                                                  dg.dataProvider.refresh();
                                                                  break;
                                                              }
                                                              default: break;
                                                          }
                                                      }
                                                    
                                                      private function handleUpdateComplete(e:Event):void
                                                      {
                                                          var currLen:uint = dg.dataProvider.length;
                                                          dg.scrollToIndex(currLen);
                                                      }
                                                    
                                                      private function handleAddRow(event:MouseEvent):void
                                                      {
                                                          var object:Object = new Object(); // on  this object set all properties...
                                                          /**here to object you can set properties coming from text input of left side but dont forget to set
                                                           * object.flag1 = 0 ; object.flag2= 0;
                                                           **/


                                                          dg.dataProvider.addItem(object)
                                                      }
                                                  ]]>
                                              </mx:Script>


                                           


                                          <mx:XMLList id="appConfy">
                                              <screens>
                                                  <screenname>Screen 1</screenname>
                                                  <flag1>0</flag1>
                                                  <flag2>0</flag2>
                                                  <provision>true</provision>
                                              </screens>
                                              <screens>
                                                  <screenname>Screen 2</screenname>
                                                  <flag1>0</flag1>
                                                  <flag2>0</flag2>
                                                  <provision>true</provision>
                                                
                                              </screens>
                                              <screens>
                                                  <screenname>Screen 3</screenname>
                                                  <flag1>0</flag1>
                                                  <flag2>0</flag2>
                                                  <provision>true</provision>
                                                
                                              </screens>
                                              <screens>
                                                  <screenname>Screen 4</screenname>
                                                  <flag1>0</flag1>
                                                  <flag2>0</flag2>
                                                  <provision>true</provision>
                                                
                                              </screens>
                                          </mx:XMLList>


                                           


                                          <!-- Validation Checking -->
                                            
                                              <mx:StringValidator source="{appId}" property="text" minLength="4" maxLength="20"/>
                                              <mx:StringValidator source="{author}" property="text"/>
                                              <mx:StringValidator source="{catgry}" property="text"/>
                                              <mx:StringValidator source="{appdspname}" property="text"/>
                                              <mx:StringValidator source="{nme}" property="text"/>
                                              <mx:StringValidator source="{tag}" property="text"/>
                                              <mx:StringValidator source="{unstalmsg}" property="text"/>
                                              <mx:StringValidator source="{iconid}" property="text"/>
                                              <mx:StringValidator source="{ver}" property="text"/>


                                           


                                          <mx:ApplicationControlBar width="100%" dock="true" paddingLeft="30" paddingTop="10">
                                              <mx:Spacer width="2%"/>
                                              <mx:LinkButton toolTip="Info" id="infoLnk"/>
                                              <mx:Spacer width="75%"/>
                                              <mx:Label text="Logged in as &lt;UserName&gt;" enabled="true"/>
                                              <mx:LinkButton label="Sign out" enabled="true"/>
                                          </mx:ApplicationControlBar>
                                          <mx:Panel id="rootPanel" width="70%" height="70%" title="Application Configuration" letterSpacing="2" fontFamily="Arial" paddingLeft="20" paddingTop="20">
                                              <mx:HBox width="100%" height="100%">
                                                  <mx:Form>
                                                      <mx:FormItem label="Application Id: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                      <mx:TextInput id="appId" width="100%"/>  
                                                      </mx:FormItem>
                                                      <mx:Spacer height="10"/>
                                                      <mx:FormItem label="Author: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                          <mx:TextInput id="author" width="100%"/>
                                                      </mx:FormItem>
                                                      <mx:Spacer height="10"/>
                                                      <mx:FormItem label="Category: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                          <mx:TextInput id="catgry" width="100%"/>
                                                      </mx:FormItem>
                                                      <mx:Spacer height="10"/>
                                                      <mx:FormItem label="App Display Name: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                          <mx:TextInput id="appdspname" width="100%"/>
                                                      </mx:FormItem>
                                                      <mx:Spacer height="10"/>
                                                      <mx:FormItem label="Name: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                          <mx:TextInput id="nme" width="100%"/>
                                                      </mx:FormItem>
                                                      <mx:Spacer height="10"/>
                                                      <mx:FormItem label="Tags: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                          <mx:TextInput id="tag" width="100%"/>
                                                      </mx:FormItem>
                                                      <mx:Spacer height="10"/>
                                                      <mx:FormItem label="UninstallMsg: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                          <mx:TextInput id="unstalmsg" width="100%"/>
                                                      </mx:FormItem>
                                                      <mx:Spacer height="10"/>
                                                      <mx:FormItem label="Icon Id: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                          <mx:TextInput id="iconid" width="100%"/>
                                                      </mx:FormItem>
                                                      <mx:Spacer height="10"/>
                                                      <mx:FormItem label="Version: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                          <mx:TextInput id="ver" width="100%"/>
                                                      </mx:FormItem>
                                                    
                                                  </mx:Form>
                                                  <mx:Spacer width="50"/>
                                                  <mx:DataGrid id="dg" width="100%" dataProvider="{appConfy}" wordWrap="true" itemClick="setRadioValues(event);" updateComplete="handleUpdateComplete(event)">
                                                      <mx:columns>
                                                          <mx:DataGridColumn dataField="screenname" headerText="Screen Name" width="8" wordWrap=""/>
                                                          <mx:DataGridColumn headerText="Help Option" width="8" paddingLeft="5" >
                                                              <mx:itemRenderer>
                                                                  <mx:Component>
                                                                         <mx:HBox>
                                                                             <mx:RadioButton id="rdBtnHelp" label="Help " selected="{Boolean(parseInt(data.flag1))}" />
                                                                         </mx:HBox>
                                                                  </mx:Component>
                                                              </mx:itemRenderer>
                                                          </mx:DataGridColumn>
                                                          <mx:DataGridColumn headerText="Start Option" width="8" paddingLeft="5">
                                                              <mx:itemRenderer>
                                                                  <mx:Component>
                                                                      <mx:HBox>
                                                                          <mx:RadioButton id="rdBtnStart" label="Start " selected="{Boolean(parseInt(data.flag2))}" /> 
                                                                      </mx:HBox>
                                                                  </mx:Component>
                                                              </mx:itemRenderer>
                                                          </mx:DataGridColumn>     
                                                          <mx:DataGridColumn dataField="provision" headerText="" width="8" paddingLeft="5">
                                                              <mx:itemRenderer>
                                                                  <mx:Component>
                                                                      <mx:HBox>
                                                                      <mx:Spacer width="5%"/>
                                                                      <mx:LinkButton  toolTip="Edit"/>
                                                                      <mx:Spacer width="7%"/>
                                                                      <mx:LinkButton  toolTip="Dlink"/>
                                                                      </mx:HBox>
                                                                  </mx:Component>
                                                              </mx:itemRenderer>
                                                          </mx:DataGridColumn>
                                                      </mx:columns>
                                                  </mx:DataGrid>
                                                  <mx:LinkButton toolTip="Add Screen" id="newScreenLnk" paddingTop="5" click="handleAddRow(event)" />
                                                
                                                
                                              </mx:HBox>
                                            
                                              <mx:HBox width="100%" paddingBottom="20">
                                                  <mx:Spacer width="55%"/>
                                                  <mx:Button id="provApp" label="Save and Provision"/>
                                                  <mx:Button id="save" label="Save"/>
                                                  <mx:Button id="del" label="Delete Application"/>
                                                  <mx:Button id="cancel" label="Cancel"/>
                                                
                                              </mx:HBox>
                                          </mx:Panel>
                                          </mx:Application>


                                           

                                          • 19. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                                            GG_81 Level 1

                                            Hi,

                                             

                                                 Sorry Prashant for late reply as i was not in town. Yes i tried your code its working fine. Thanxs alot. But i'm having one problem when i click the add.png image for dynamically adding the row in the data grid, it throws error. I am attaching the image and pasting the code for viewing. Please do the needful changes

                                            error_image.JPG

                                             

                                            Source Code

                                             

                                             

                                            <?xml version="1.0" encoding="utf-8"?>
                                            <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%">

                                             

                                             



                                            <mx:Script>
                                                    <![CDATA[
                                                        import mx.binding.utils.BindingUtils;
                                                        import mx.controls.Alert;
                                                        import mx.events.ListEvent;
                                                        import mx.events.FlexEvent;
                                                        import mx.utils.ObjectUtil;
                                                        import mx.collections.ArrayCollection;




                                            //            public function init():void
                                            //            {
                                            //                dg.dataProvider = new ArrayCollection();
                                            //                var object:Object = new Object();
                                            //                object.flag1 = false;
                                            //                object.flag2 = false;
                                            //            
                                            //                dg.dataProvider.addItem(object);
                                            //                dg.dataProvider.addItem(ObjectUtil.copy(object));
                                            //            }
                                                    
                                                        public function setRadioValues(event:ListEvent):void
                                                        {
                                                            switch(event.columnIndex)
                                                            {
                                                                case 1 :
                                                                {
                                                                    dg.selectedItem.flag1 = 1;
                                                                    dg.selectedItem.flag2 = 0;
                                                                    dg.dataProvider.refresh();
                                                                    break;
                                                                }
                                                                case 2 :
                                                                {
                                                                    dg.selectedItem.flag1 = 0;
                                                                    dg.selectedItem.flag2 = 1;
                                                                    dg.dataProvider.refresh();
                                                                    break;
                                                                }
                                                                default: break;
                                                            }
                                                        }
                                                     
                                                        private function handleUpdateComplete(e:Event):void
                                                        {
                                                            var currLen:uint = dg.dataProvider.length;
                                                            dg.scrollToIndex(currLen);
                                                        }
                                                     
                                                        private function handleAddRow(event:MouseEvent):void
                                                        {
                                                            var object:Object = new Object(); // on  this object set all properties...
                                                            /**here to object you can set properties coming from text input of left side but dont forget to set
                                                              object.flag1 = 0 ; object.flag2= 0;**/
                                                           



                                                            dg.dataProvider.addItem(object)
                                                            object.addItem(
                                                                {
                                                                    "screenname": "Screen " + dg.dataProvider.length,
                                                                    "flag1": "",
                                                                    "flag2": "",
                                                                    "provision":""
                                                                }
                                                            );
                                                        }
                                                    ]]>
                                                </mx:Script>




                                            <mx:XMLList id="appConfy">
                                                <screens>
                                                    <screenname>Screen 1</screenname>
                                                    <flag1>0</flag1>
                                                    <flag2>0</flag2>
                                                    <provision>true</provision>
                                                </screens>
                                                <screens>
                                                    <screenname>Screen 2</screenname>
                                                    <flag1>0</flag1>
                                                    <flag2>0</flag2>
                                                    <provision>true</provision>
                                                 
                                                </screens>
                                                <screens>
                                                    <screenname>Screen 3</screenname>
                                                    <flag1>0</flag1>
                                                    <flag2>0</flag2>
                                                    <provision>true</provision>
                                                 
                                                </screens>
                                                <screens>
                                                    <screenname>Screen 4</screenname>
                                                    <flag1>0</flag1>
                                                    <flag2>0</flag2>
                                                    <provision>true</provision>
                                                 
                                                </screens>
                                            </mx:XMLList>




                                            <!-- Validation Checking -->
                                             
                                                <mx:StringValidator source="{appId}" property="text" minLength="4" maxLength="20"/>
                                                <mx:StringValidator source="{author}" property="text"/>
                                                <mx:StringValidator source="{catgry}" property="text"/>
                                                <mx:StringValidator source="{appdspname}" property="text"/>
                                                <mx:StringValidator source="{nme}" property="text"/>
                                                <mx:StringValidator source="{tag}" property="text"/>
                                                <mx:StringValidator source="{unstalmsg}" property="text"/>
                                                <mx:StringValidator source="{iconid}" property="text"/>
                                                <mx:StringValidator source="{ver}" property="text"/>




                                            <mx:ApplicationControlBar width="100%" dock="true" paddingLeft="30" paddingTop="10">
                                                <mx:Spacer width="2%"/>
                                                <mx:LinkButton icon="@Embed(source='../resources/info.png')" toolTip="Info" id="infoLnk"/>
                                                <mx:Spacer width="75%"/>
                                                <mx:Label text="Logged in as &lt;UserName&gt;" enabled="true"/>
                                                <mx:LinkButton label="Sign out" enabled="true"/>
                                            </mx:ApplicationControlBar>
                                            <mx:Panel id="rootPanel" width="70%" height="70%" title="Application Configuration" letterSpacing="2" fontFamily="Arial" paddingLeft="20" paddingTop="20">
                                                <mx:HBox width="100%" height="100%">
                                                    <mx:Form>
                                                        <mx:FormItem label="Application Id: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                        <mx:TextInput id="appId" width="100%"/> 
                                                        </mx:FormItem>
                                                        <mx:Spacer height="10"/>
                                                        <mx:FormItem label="Author: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                            <mx:TextInput id="author" width="100%"/>
                                                        </mx:FormItem>
                                                        <mx:Spacer height="10"/>
                                                        <mx:FormItem label="Category: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                            <mx:TextInput id="catgry" width="100%"/>
                                                        </mx:FormItem>
                                                        <mx:Spacer height="10"/>
                                                        <mx:FormItem label="App Display Name: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                            <mx:TextInput id="appdspname" width="100%"/>
                                                        </mx:FormItem>
                                                        <mx:Spacer height="10"/>
                                                        <mx:FormItem label="Name: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                            <mx:TextInput id="nme" width="100%"/>
                                                        </mx:FormItem>
                                                        <mx:Spacer height="10"/>
                                                        <mx:FormItem label="Tags: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                            <mx:TextInput id="tag" width="100%"/>
                                                        </mx:FormItem>
                                                        <mx:Spacer height="10"/>
                                                        <mx:FormItem label="UninstallMsg: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                            <mx:TextInput id="unstalmsg" width="100%"/>
                                                        </mx:FormItem>
                                                        <mx:Spacer height="10"/>
                                                        <mx:FormItem label="Icon Id: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                            <mx:TextInput id="iconid" width="100%"/>
                                                        </mx:FormItem>
                                                        <mx:Spacer height="10"/>
                                                        <mx:FormItem label="Version: " letterSpacing="2" fontSize="11" fontFamily="Arial" fontWeight="bold">
                                                            <mx:TextInput id="ver" width="100%"/>
                                                        </mx:FormItem>
                                                     
                                                    </mx:Form>
                                                    <mx:Spacer width="50"/>
                                                    <mx:DataGrid id="dg" width="100%" dataProvider="{appConfy}" wordWrap="true" itemClick="setRadioValues(event);" updateComplete="handleUpdateComplete(event)">
                                                        <mx:columns>
                                                            <mx:DataGridColumn dataField="screenname" headerText="Screen Name" width="8" wordWrap=""/>
                                                            <mx:DataGridColumn headerText="Help Option" width="8" paddingLeft="5" >
                                                                <mx:itemRenderer>
                                                                    <mx:Component>
                                                                           <mx:HBox>
                                                                               <mx:RadioButton id="rdBtnHelp" label="Help " selected="{Boolean(parseInt(data.flag1))}" />
                                                                           </mx:HBox>
                                                                    </mx:Component>
                                                                </mx:itemRenderer>
                                                            </mx:DataGridColumn>
                                                            <mx:DataGridColumn headerText="Start Option" width="8" paddingLeft="5">
                                                                <mx:itemRenderer>
                                                                    <mx:Component>
                                                                        <mx:HBox>
                                                                            <mx:RadioButton id="rdBtnStart" label="Start " selected="{Boolean(parseInt(data.flag2))}" />
                                                                        </mx:HBox>
                                                                    </mx:Component>
                                                                </mx:itemRenderer>
                                                            </mx:DataGridColumn>    
                                                            <mx:DataGridColumn dataField="provision" headerText="" width="8" paddingLeft="5">
                                                                <mx:itemRenderer>
                                                                    <mx:Component>
                                                                        <mx:HBox>
                                                                        <mx:Spacer width="5%"/>
                                                                        <mx:LinkButton icon="@Embed(source='../resources/new_page.png')" toolTip="Edit"/>
                                                                        <mx:Spacer width="7%"/>
                                                                        <mx:LinkButton icon="@Embed(source='../resources/delete.png')" toolTip="Dlink"/>
                                                                        </mx:HBox>
                                                                    </mx:Component>
                                                                </mx:itemRenderer>
                                                            </mx:DataGridColumn>
                                                        </mx:columns>
                                                    </mx:DataGrid>
                                                    <mx:LinkButton icon="@Embed(source='../resources/add.png')" toolTip="Add Screen" id="newScreenLnk" paddingTop="5" click="handleAddRow(event)" />
                                                 
                                                 
                                                </mx:HBox>
                                             
                                                <mx:HBox width="100%" paddingBottom="20">
                                                    <mx:Spacer width="55%"/>
                                                    <mx:Button id="provApp" label="Save and Provision"/>
                                                    <mx:Button id="save" label="Save"/>
                                                    <mx:Button id="del" label="Delete Application"/>
                                                    <mx:Button id="cancel" label="Cancel"/>
                                                 
                                                </mx:HBox>
                                            </mx:Panel>
                                            </mx:Application>

                                             

                                             

                                            I have also attached the add.png.

                                             

                                             

                                            Thanxs

                                             

                                            Gaurav

                                            • 20. Re: Unable to select 2 Radio Buttons in different columns in a DataGrid.
                                              *Prashant Shelke* Level 4

                                              This problem is coming due to your trying to add different type of object to dataProvider as its already using XMLList objects. Try to create same type of object as other objects.