6 Replies Latest reply on Dec 18, 2009 9:27 AM by dunn1974

    Get another cell in same row from DataGrid

    dunn1974

      Hi,

       

      I'm experienced with ActionScript, but very new to Flex.

       

      I've got a DataGrid with several columns, one of which contains ComboBoxes.  Each DataGrid column uses a custom itemRenderer, which is defined in an ActionScript class (not MXML).

       

      On change of any of the ComboBoxes, I need to update a couple other cells in the same row of the DataGrid, based on the selectedItem and the values of still other cells in the same row.

       

      I think DataGridListData(listItem) gives me the DataGrid object, but how to I access the other cells in the same row as the ComboBox?

       

      Thank you.

        • 1. Re: Get another cell in same row from DataGrid
          saisri2k2 Level 4

          If you click on any column in the DataGrid (It be itemRenderer or ordinary column) that will be registered and you can access it from the ActionScript using

           

          dataGridName.selectedItem (will return you an Object with all the data of the selected row)

           

          If you want to manipulate the data in the datagrid then(Assuming you are using Array collection as dataProvider to the dataGridName)

           

           

          var index:int = acData.getItemIndex(dataGridName.selectedItem);  // acData is the dataProvider to the dataGrid

           

          var selectedItem:Object = acData.getItemAt(index);

           

          //Manipulate the selecteditem using your logic and then refresh the datagrid data by the following line

           

          dataGridName.invalidateList(); //to refresh

          • 2. Re: Get another cell in same row from DataGrid
            dunn1974 Level 1

            Hi Saisri,


            Thanks for the reply, your answer provided some valuable information, but I'm still not quite there.  Since each of my columns implement custom AS classes as itemRenderers, how do I access the DataGrid that contains it, and its dataProvider?  Remember, each itemRenderer is an AS Class, so I can't access it directly.

             

            Thanks again.

            • 3. Re: Get another cell in same row from DataGrid
              saisri2k2 Level 4

              Could you give an example on what your Itemrenderer does? (As far as i know, the itemRenderers are used to display only)

               

              "FYI:You cannot access the cells or itemrenderers of a datagrid from the actionscript. All you can do is, prepare an dataprovider and assign it to the dataGrid."

               

              My example: I use the ArrayCollection to set the data in the itemRenderer

               

              In AS file: acList.addItem({name:"something"});

               

              in MXML .

               

              <mx:DataGrid dataProvider="{acList}">

              <mx:Columns>

               

              <mx:DataGridColumn headerText="Name" >

                              <mx:itemRenderer>

                                  <mx:Component>

                                      <mx:Canvas>

                                           <mx:textInput text="{data.name}"/>

                                      </mx:Canvas>

                                  </mx:Component>

                              </mx:itemRenderer>

              </mx:DataGridColumn>

              </mx:columns>

              <mx:DataGrid>

               

               

              HERE THE TEXTINPUT COULD BE ANY ITEMRENDERER(I WOULD PROGRAM IT IN SUCH A WAY THAT WILL DISPLAY WHAT EVERY I PUT IN THE DATA.NAME).

               

              If possible put a sample snippet of your MXML(Data grid) and the custom component which is acting as the ItemRenderer

               

              Message was edited by: saisri2k2

              • 4. Re: Get another cell in same row from DataGrid
                dunn1974 Level 1

                here's the MXML of the datagrid, in the main application file:

                 

                <mx:DataGrid dataProvider="{lineItems}">

                  <mx:columns>

                  <mx:DataGridColumn width="30" itemRenderer="renderers.DeleteRow" dataField="deleteRow" headerText="Delete" />

                  <mx:DataGridColumn width="120" itemRenderer="renderers.DateRate" dataField="dateRate" headerText="Date" />

                  <mx:DataGridColumn width="120" itemRenderer="renderers.UOMBox" dataField="uom" headerText="UOM" />

                  <mx:DataGridColumn width="30" dataField="unitRate" headerText="Unit" />

                  </mx:columns>

                </mx:DataGrid>

                 

                lineItems is an ArrayCollection of simple Objects, and each renderer is a ActionScript class

                 

                UOMBox extends ComboBox:

                 

                package renderers {

                 

                import flash.events.Event;

                import mx.controls.ComboBox;

                 

                public class UOMBox extends ComboBox {

                private function changeHandler(event:Event):void{

                //  this is where i'd want to update the other cells

                }

                override public function set data(value:Object):void{

                dataProvider = value.uom;

                }

                public function UOMBox():void {

                labelField = "LABEL";

                addEventListener("change", changeHandler, false, 0, true);

                }

                }

                }

                 

                so UOM is a ComboBox with different Units of Measure.  When that changes, I need to update the Unit Rate so that it shows in the cell.

                 

                Thanks for your help

                • 5. Re: Get another cell in same row from DataGrid
                  saisri2k2 Level 4

                  Now I clearly understood what you are saying. Now the explanation is very lengthy. Lot of steps!!! And it is a lot involved!!!!

                   

                  first create a call back function in the main ActionScript(not the Itemrenderer classes)

                   

                  public function callBackFunction( text:String):void{

                       //put all the logic you want to do whne the combobox is changed

                  //     i would do the following

                   

                  var index:int = lineItems.getItemIndex(dataGridName.selectedItem);  // acData is the dataProvider to the dataGrid

                   

                  var selectedItem:Object = lineItems.getItemAt(index);

                   

                  selectedItem.uom = xxx;

                  selectedItem.dateRate = xxx;

                  selectedItem.deleteRow = xxx;

                   

                  }

                   

                  in lineItems array collection include the following when adding data

                   

                  lineItems.addItem({............ callBack:callBackFunction});

                   

                  // here callBackFunction is the function in the main ActionScript.. here you are actually passing the pointer of the function in the array collection to the itemRenderers

                   

                  Now time to change the "ItemRendererClasses"

                   

                  public var callBackFunc:Function;

                  public var obj:CheckBox;


                   

                   

                  public function set data(value:Object):void {

                          _data = value;

                         callBackFunc = value.callBack;

                        

                       

                      }

                   

                    //When the checkBox change direct that to another method 'onSelectionChange'. I would do it like the following

                   

                  override protected function commitProperties():void {

                          super.commitProperties();   

                              obj = new CheckBox();

                             obj.addEventListener(Event.CHANGE, onSelectionChange);

                              addChild(obj);

                              if(_data)

                               obj.selected = _data.selected;

                  }


                   

                  public function onSelectionChange():void{

                       callBackFunc (); //Will call the callBackFunction of the main actionScript

                  }

                   

                   

                  Hope this should work. I've never tried, but it should get you  going. It is very involved right now. It is all Pointers!!

                   

                   

                  In your code in the ItemRendererclasses there is ChangeHandler function - in that function call callBackFunc();

                   

                  Again: YOU CANNOT ACCESS THE ITEM RENDERERS, BUT YOU CAN SET THE VALUE OF THE ITEMRENDERER LIKE I'VE DONE IN THE CALLBACKFUNCTION IN THE MAIN ACTIONSCRIPT.

                   

                  Message was edited by: saisri2k2

                  1 person found this helpful
                  • 6. Re: Get another cell in same row from DataGrid
                    dunn1974 Level 1

                    That should get me started - thanks.