4 Replies Latest reply on Jul 29, 2010 1:06 PM by Benoitcn

    How change datagrid columns dynamically

    Benoitcn Level 1

      I have a advancedDataGrid in mxml and then I create some advancedDataGridColumnGroup and his children columns pass them

      to the advancedDataGrid. But the datagrid can't reaction the new changes ? How can achieve the function ?

        • 1. Re: How change datagrid columns dynamically
          VRPDeveloper Level 3

          You can do something like this

           

          var length : int = Storesdp.length;
                                                  for( var i : int = 0; i < length; i++ )
                                                  {
                                                  oColumnDef_amt = new AdvancedDataGridColumn(i+"_amt");
                                                  oColumnDef_amt.headerText = "Amount"
                                                  oColumnDef_amt.dataField = "S"+Storesdp.getItemAt(i).data+"_amt";
                                                  oColumnDef_amt.width = 100;
                                              oColumnDef_amt.sortable = true;
                                              oColumnDef_amt.visible = true;
                                              oColumnDef_amt.editable = false;
                                              oColumnDef_amt.wordWrap = false;
                                              oColumnDef_amt.labelFunction = amtLabelFunction;
                                                  oColumnDef_amt.setStyle("textAlign","right");
                                   
                                                  colArray.push(oColumnDef_amt);

           

           

           

                                                  oColumnDef_cnt = new AdvancedDataGridColumn(i+"_cnt");
                                                  oColumnDef_cnt.headerText = "Count";
                                                  oColumnDef_cnt.dataField = "S"+Storesdp.getItemAt(i).data+"_cnt";
                                                  oColumnDef_cnt.width = 50;
                                              oColumnDef_cnt.sortable = true;
                                              oColumnDef_cnt.visible = true;
                                              oColumnDef_cnt.editable = false;
                                              oColumnDef_cnt.wordWrap = false;
                                              //oColumnDef.labelFunction = amtLabelFunction;
                                                  oColumnDef_cnt.setStyle("textAlign","right");
                                   
                                                  colArray.push(oColumnDef_cnt);

           

          var columnGroup:AdvancedDataGridColumnGroup=new AdvancedDataGridColumnGroup(String(i));
                                                  columnGroup.headerText=Storesdp.getItemAt(i).label;
                                                  columnGroup.children.push(oColumnDef_amt);
                                                  columnGroup.children.push(oColumnDef_cnt);
                                                  colArray.push(columnGroup);                     
                                              }
                                  _columns = colArray;
                                  adg.columns = _columns;

           

          If this post answers your question or helps, please kindly mark it as such.

          1 person found this helpful
          • 2. Re: How change datagrid columns dynamically
            Benoitcn Level 1

            Yes I do that. But the datagrid doesn't show the data.

            If I write the groups and columns in the mxml section of the datagrid it works find.

            Should I refresh the dataprivoider of the datagrid after change the groupedColumns of the datagrid?

            • 3. Re: How change datagrid columns dynamically
              VRPDeveloper Level 3

              You can do it by

               

              datagrid.dataProvider.refresh();

               

              If this post answers your question or helps, please kindly mark it as such.

              1 person found this helpful
              • 4. Re: How change datagrid columns dynamically
                Benoitcn Level 1

                This is my code for testing.  I still can't make the datagrid refresh the new columns ~~

                 

                 

                 

                <?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.controls.advancedDataGridClasses.AdvancedDataGridColumn;


                   import mx.controls.advancedDataGridClasses.AdvancedDataGridColumnGroup;


                 


                   protected function button1_clickHandler(event:MouseEvent):void


                   {


                    var adgcg:AdvancedDataGridColumnGroup = new AdvancedDataGridColumnGroup("Employee");

                 


                    var adgc:AdvancedDataGridColumn;

                 


                    var arr:Array = new Array();


                  


                    for each( var j:* in emp[0].*){


                     trace("node name of each child \n" + j.name());


                     adgc = new AdvancedDataGridColumn(j.name());


                     adgc.dataField = j.name();


                     //adgcg.children.push(adgc);     doesn't work


                     arr.push(adgc); // doesn't work too ~


                    }


                  


                    adgcg.children = arr;


                  


                    dg.groupedColumns = [adgcg];


                  


                    dg.dataProvider.refresh();


                  


                   }


                  ]]>


                </mx:Script>




                <mx:XMLList id="emp">


                  <employee>


                   <name>Christina Coenraets</name>


                   <phone>555-219-2270</phone>


                   <email>ccoenraets@fictitious.com</email>


                   <active>true</active>


                   <image>images/arrow_icon_sm.png</image>


                  </employee>


                  <employee>


                   <name>Joanne Wall</name>


                   <phone>555-219-2012</phone>


                   <email>jwall@fictitious.com</email>


                   <active>true</active>


                  </employee>


                  <employee>


                   <name>Maurice Smith</name>


                   <phone>555-219-2012</phone>


                   <email>maurice@fictitious.com</email>


                   <active>false</active>


                  </employee>


                  <employee>


                   <name>Mary Jones</name>


                   <phone>555-219-2000</phone>


                   <email>mjones@fictitious.com</email>


                   <active>true</active>


                  </employee>


                  <employee>


                   <name>Benoit Hoyee</name>


                   <phone>525-220-2228</phone>


                   <email>sdkennes@fictitious.com</email>


                   <active>false</active>


                  </employee>


                  <employee>


                   <name>Jack Jones</name>


                   <phone>125-219-2000</phone>


                   <email>Mcones@fictitious.com</email>


                   <active>true</active>


                  </employee>


                  <employee>


                   <name>Luonce Jos</name>


                   <phone>555-219-872</phone>


                   <email>Jos@cncn.com</email>


                   <active>true</active>


                  </employee>


                </mx:XMLList>



                <mx:VBox autoLayout="true" width="1200" height="700">


                  <mx:AdvancedDataGrid id="dg"  dataProvider="{emp}" width="800" height="400">


                   <mx:groupedColumns>


                    <mx:AdvancedDataGridColumnGroup headerText="Employee">


                     <mx:AdvancedDataGridColumn headerText="Name" dataField="name"/>


                    </mx:AdvancedDataGridColumnGroup>


                   </mx:groupedColumns>


                  </mx:AdvancedDataGrid>


                  <mx:Button click="button1_clickHandler(event)" label="CreateGroup" />


                </mx:VBox>


                </mx:Application>