0 Replies Latest reply on Jul 31, 2011 11:14 PM by Michael Promotea

    2 way databinding between DataGrid and DropDownList

    Michael Promotea


      I am not getting anywhere with what I thought is the most simplest basic thing in the world.

       

      I have a ArrayCollection "employees" which is used to fill a DataGrid. The department is listed as an Integer value. I would like to display however the name of the department, which is in a second ArrayCollection "departmentsArray". So the itemRenderer (which is not yet implemented in this code) needs to match the "idn" value with the "departmentid" value and then display the name of the department. However, when the user clicks on the DropDownLists and selects a new department, the departmentid value in the employee array needs to get updated too.

       

      I am assuming that this can be done with 2 way databinding, but I am not getting this to work and would greatly appreciate if someone could show me how the code would have to look for this.

       

      Michael

       

       

      <?xml version="1.0" encoding="utf-8"?>
      <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
                        xmlns:s="library://ns.adobe.com/flex/spark" 
                        xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
           <fx:Declarations>
                <!-- Platzieren Sie nichtvisuelle Elemente (z. B. Dienste, Wertobjekte) hier -->
      
           
           </fx:Declarations>
           <fx:Script>
                <![CDATA[                
                     import mx.collections.ArrayCollection;
                     
                     [Bindable]
                     private var employees:ArrayCollection = new ArrayCollection([
                          {idn:1, firstname:'Lisa', lastname:'Tran', departmentid:1},
                          {idn:2, firstname:'Michael', lastname:'Orchard', departmentid:2},
                          {idn:3, firstname:'Wolfgang', lastname:'Prettyer', departmentid:2},
                          {idn:4, firstname:'Julia', lastname:'Stancau', departmentid:3},
                     ]);     
                     
                     [Bindable]
                     private var departmentsArray:ArrayCollection = new ArrayCollection([
                          {idn:1, department:'Video'},
                          {idn:2, department:'Web'},
                          {idn:3, department:'Print'},
                     ]); 
                
                ]]>
           </fx:Script>
           
           <s:DataGrid x="57" y="90" width="410" requestedRowCount="4" dataProvider="{employees}">
                <s:columns>
                     <s:ArrayList>
                          <s:GridColumn dataField="idn" headerText="ID"></s:GridColumn>
                          <s:GridColumn dataField="firstname" headerText="Vorname"></s:GridColumn>
                          <s:GridColumn dataField="lastname" headerText="Nachname"></s:GridColumn>
                          <s:GridColumn dataField="departmentid" headerText="Department"></s:GridColumn>
                     </s:ArrayList>
      
                </s:columns>
           
                
           </s:DataGrid>
      </s:Application>