2 Replies Latest reply on Sep 29, 2009 9:12 AM by larry_schwartz

    AdvancedDataGrid - Add columns with ActionScript

    larry_schwartz Level 1

      I'm trying to add columns to an AdvancedDataGrid via ActionScript.

       

       

      I can't get it to work.

       

       

      I've tried two approaches -- One with an intermediary array to store the columns then set the adg's columns to the array; One where I assign the columns directly to the adg's columns array.

       

       

      They both fail in their own way.  The columns don't "take" and the adg uses the dataProviders defaults, or there are no columns at all.

       

       

      "adg_test.mxml" has the AdvancedDataGrids/code. 

       

      "adg_test_renderer.mxml" is a renderer for one of the columns.

       

       

      Would appreciate learning what I'm doing wrong.

       

       

      Thanks for any help.

       

       

      === START adg_test_renderer.mxml  ===

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml">
           <mx:Button id="btnTest" label="Renderer Working"/>
      </mx:VBox>

       

      === END adg_test_renderer.mxml  ===

       

       

      == START adg_test.mxml ====

       

      <?xml version="1.0"?>
      <mx:Application
          xmlns:mx="http://www.adobe.com/2006/mxml"
          initialize="init()">

       

          <mx:Script>
            <![CDATA[
               import mx.collections.ArrayCollection;
                       
               [Bindable]
               private var dpADGExplicit:ArrayCollection = new ArrayCollection([
                 {Artist:'Pavement', Album:'Slanted and Enchanted', Price:11.99},
                 {Artist:'Pavement', Album:'Brighten the Corners', Price:11.99},
                 {Artist:'Saner', Album:'A Child Once', Price:11.99},
                 {Artist:'Saner', Album:'Helium Wings', Price:12.99},
                 {Artist:'The Doors', Album:'The Doors', Price:10.99},
                 {Artist:'The Doors', Album:'Morrison Hotel', Price:12.99},
                 {Artist:'Grateful Dead', Album:'American Beauty', Price:11.99},
                 {Artist:'Grateful Dead', Album:'In the Dark', Price:11.99},
                 {Artist:'Grateful Dead', Album:'Shakedown Street', Price:11.99},
                 {Artist:'The Doors', Album:'Strange Days', Price:12.99},
                 {Artist:'The Doors', Album:'The Best of the Doors', Price:10.99}
               ]);  
              
               [Bindable]
               private var dpADGActionScript:ArrayCollection = new ArrayCollection([
                 {Artist:'Pavement', Album:'Slanted and Enchanted', Price:11.99},
                 {Artist:'Pavement', Album:'Brighten the Corners', Price:11.99},
                 {Artist:'Saner', Album:'A Child Once', Price:11.99},
                 {Artist:'Saner', Album:'Helium Wings', Price:12.99},
                 {Artist:'The Doors', Album:'The Doors', Price:10.99},
                 {Artist:'The Doors', Album:'Morrison Hotel', Price:12.99},
                 {Artist:'Grateful Dead', Album:'American Beauty', Price:11.99},
                 {Artist:'Grateful Dead', Album:'In the Dark', Price:11.99},
                 {Artist:'Grateful Dead', Album:'Shakedown Street', Price:11.99},
                 {Artist:'The Doors', Album:'Strange Days', Price:12.99},
                 {Artist:'The Doors', Album:'The Best of the Doors', Price:10.99}
               ]);  
              
              
              private function init():void
              {
                  var arr:Array=[];//Intermediary array that will become the AdvancedDataGridColumn array
                  var col:AdvancedDataGridColumn = new AdvancedDataGridColumn();

       

                  col.dataField = "Artist";
                  arr.push(col);
                 
                  col.dataField = "Album";
                  col.visible = false;
                  arr.push(col);
                 
                  col.dataField = "Price";
                  col.itemRenderer = new ClassFactory(adg_test_renderer);
                  arr.push(col);
             
                  adgActionScript.columns = arr;
                 
                 
                  //ALTERNATE UNSUCCESFUL APPROACH
                 
                  /*
                  col.dataField = "Artist";
                  adgActionScript.columns.push(col);
                 
                  col.dataField = "Album";
                  col.visible = false;
                  adgActionScript.columns.push(col);
                 
                  col.dataField = "Price";
                  col.itemRenderer = new ClassFactory(adg_test_renderer);
                  adgActionScript.columns.push(col);
                  */
              }
                             
            ]]>
          </mx:Script>

       

          <mx:Label text="Explicit Columns"/>
         
          <mx:AdvancedDataGrid
              id="adgExplicit"
              width="100%" height="100%"
              sortExpertMode="true"
              dataProvider="{dpADGExplicit}">
              <mx:columns>
                  <mx:AdvancedDataGridColumn dataField="Artist" />
                  <mx:AdvancedDataGridColumn dataField="Album" visible="false"/>
                  <mx:AdvancedDataGridColumn dataField="Price" itemRenderer="adg_test_renderer"/>
              </mx:columns>
         </mx:AdvancedDataGrid>
        
         <mx:Label text="ActionScript Columns (If ActionScript works: Arist column should be hidden. Should see Album column with data and Price column with buttons."/>
        
          <mx:AdvancedDataGrid
              id="adgActionScript"
              width="100%" height="100%"
              sortExpertMode="true"
              dataProvider="{dpADGActionScript}">
         </mx:AdvancedDataGrid>
               
      </mx:Application>

       

       

       

      == END adg_test.mxml ====

        • 1. Re: AdvancedDataGrid - Add columns with ActionScript
          NewbieToFlex Level 1

          If you are looking to Add columns with ActionScript follow this.

           

          var _advancedDataGrid : AdvancedDataGrid = new AdvancedDataGrid();

           

          var columns : Array = _advancedDataGrid.columns;

          columns.push(new AdvancedDataGridColumn('field1'));

          columns.push(new AdvancedDataGridColumn('field2'));

          columns.push(new AdvancedDataGridColumn('field3'));

          _advancedDataGrid.columns = columns;

           

          _advancedDataGrid.validateNow();

          • 2. Re: AdvancedDataGrid - Add columns with ActionScript
            larry_schwartz Level 1

            Thanks so much for your help.

             

            Here's how I altered your code for my example.  This logic allows easier assignment of additional column parameters.

             

            === START adg_test_renderer.mxml  ===

             

            <?xml version="1.0" encoding="utf-8"?>
            <mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml">
                <mx:Button id="btnTest" label="Renderer Working"/>
            </mx:VBox>

             

             

            === END adg_test_renderer.mxml  ===

             

             

             

            == START adg_test.mxml ====

             

            <?xml version="1.0"?>
            <mx:Application
                xmlns:mx="http://www.adobe.com/2006/mxml"
                initialize="init()">

             

                <mx:Script>
                  <![CDATA[
                 
                     import mx.collections.ArrayCollection;
                             
                     [Bindable]
                     private var dpADGExplicit:ArrayCollection = new ArrayCollection([
                       {Artist:'Pavement', Album:'Slanted and Enchanted', Price:11.99},
                       {Artist:'Pavement', Album:'Brighten the Corners', Price:11.99},
                       {Artist:'Saner', Album:'A Child Once', Price:11.99},
                       {Artist:'Saner', Album:'Helium Wings', Price:12.99},
                       {Artist:'The Doors', Album:'The Doors', Price:10.99},
                       {Artist:'The Doors', Album:'Morrison Hotel', Price:12.99},
                       {Artist:'Grateful Dead', Album:'American Beauty', Price:11.99},
                       {Artist:'Grateful Dead', Album:'In the Dark', Price:11.99},
                       {Artist:'Grateful Dead', Album:'Shakedown Street', Price:11.99},
                       {Artist:'The Doors', Album:'Strange Days', Price:12.99},
                       {Artist:'The Doors', Album:'The Best of the Doors', Price:10.99}
                     ]);  
                    
                     [Bindable]
                     private var dpADGActionScript:ArrayCollection = new ArrayCollection([
                       {Artist:'Pavement', Album:'Slanted and Enchanted', Price:11.99},
                       {Artist:'Pavement', Album:'Brighten the Corners', Price:11.99},
                       {Artist:'Saner', Album:'A Child Once', Price:11.99},
                       {Artist:'Saner', Album:'Helium Wings', Price:12.99},
                       {Artist:'The Doors', Album:'The Doors', Price:10.99},
                       {Artist:'The Doors', Album:'Morrison Hotel', Price:12.99},
                       {Artist:'Grateful Dead', Album:'American Beauty', Price:11.99},
                       {Artist:'Grateful Dead', Album:'In the Dark', Price:11.99},
                       {Artist:'Grateful Dead', Album:'Shakedown Street', Price:11.99},
                       {Artist:'The Doors', Album:'Strange Days', Price:12.99},
                       {Artist:'The Doors', Album:'The Best of the Doors', Price:10.99}
                     ]);  
                    
                    
                    private function init():void
                    {
                        var arrCols:Array = adgActionScript.columns;
                        var col:AdvancedDataGridColumn;
                       
                        col = new AdvancedDataGridColumn;
                        col.dataField = "Artist";
                        arrCols.push(col);
                       
                        col = new AdvancedDataGridColumn;
                        col.dataField = "Album";
                        col.visible = false;
                        arrCols.push(col);
                       
                        col = new AdvancedDataGridColumn;
                        col.dataField = "Price";
                        col.itemRenderer = new ClassFactory(adg_test_renderer);
                        arrCols.push(col);   
                       
                        adgActionScript.columns = arrCols;
                        adgActionScript.validateNow();
                    }
                                   
                  ]]>
                </mx:Script>

             

                <mx:Label text="Explicit Columns"/>
               
                <mx:AdvancedDataGrid
                    id="adgExplicit"
                    width="100%"
                    height="100%"
                    dataProvider="{dpADGExplicit}">
                    <mx:columns>
                        <mx:AdvancedDataGridColumn dataField="Artist" />
                        <mx:AdvancedDataGridColumn dataField="Album" visible="false"/>
                        <mx:AdvancedDataGridColumn dataField="Price" itemRenderer="adg_test_renderer"/>
                    </mx:columns>
               </mx:AdvancedDataGrid>
              
               <mx:Label text="ActionScript Columns"/>
              
                <mx:AdvancedDataGrid
                    id="adgActionScript"
                    width="100%"
                    height="100%"
                    dataProvider="{dpADGActionScript}">
               </mx:AdvancedDataGrid>
                     
            </mx:Application>

             

             

             

            == END adg_test.mxml ====