2 Replies Latest reply on Nov 21, 2011 10:23 PM by tejzify

    Grouping in Advance datagrid component

    tejzify Level 1

      Hello,

       

            I am using advance datagrid to display grouped data. Following is my code:

       

      <?xml version="1.0" encoding="utf-8"?>
      <s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009" 
                                       xmlns:s="library://ns.adobe.com/flex/spark" 
                                       xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300"
                                       close="titlewindow_closeHandler(event)" creationComplete="titlewindow1_creationCompleteHandler(event)">
                <fx:Declarations>
        
                </fx:Declarations>
                <fx:Script>
                          <![CDATA[
                                    import mx.collections.ArrayCollection;
                                    import mx.controls.DataGrid;
                                    import mx.controls.dataGridClasses.DataGridColumn;
                                    import mx.events.CloseEvent;
                                    import mx.events.FlexEvent;
                                    import mx.managers.PopUpManager;
        
                                    [Bindable]
                                    public var str:String = "";
                                    [Bindable]
                                    public var cityObjs:ArrayCollection;
                                    [Bindable]
                                    public var sum:int = 0;
        
                                    [Bindable]
                                    public var city:ArrayCollection = new ArrayCollection();
        
                                    protected function titlewindow_closeHandler(event:CloseEvent):void
                                    {
                                              PopUpManager.removePopUp(this);
                                    }
                                    
                                     protected function costGrid_creationCompleteHandler(event:FlexEvent):void
                                    {
                                              costGrid.height = 267;
                                              costGrid.width = 398;
                                              for(var i:int=0; i<cityObjs.length; i++){
                                                        if(cityObjs[i].type == "hotel" || cityObjs[i].type == "airlines"){
                                                                  city.addItem(cityObjs[i]);
                                                        }
                                              }
                                    }
      
                                    protected function titlewindow1_creationCompleteHandler(event:FlexEvent):void
                                    {
                                              costGrid.height = 267;
                                              costGrid.width = 398;
                                              for(var i:int=0; i<cityObjs.length; i++){
                                                        if(cityObjs[i].type == "hotel" || cityObjs[i].type == "airlines"){
                                                                  city.addItem(cityObjs[i]);
                                                        }
                                              }
                                    }
      
      
                          ]]>
                </fx:Script>
        
                
                <mx:AdvancedDataGrid id="costGrid" initialize="gc.refresh();">
                          <mx:dataProvider>
                                    <mx:GroupingCollection2 id="gc" source="{city}">
                                              <mx:grouping>
                                                        <mx:Grouping>
                                                                  <mx:GroupingField name="type"/>
                                                        </mx:Grouping>
                                              </mx:grouping>
                                    </mx:GroupingCollection2>
                          </mx:dataProvider>
        
                          <mx:columns>
                                    <mx:AdvancedDataGridColumn dataField="type" headerText="Type" />
                                    <mx:AdvancedDataGridColumn dataField="label" headerText="Cost For" />
                                    <mx:AdvancedDataGridColumn dataField="cost" headerText="Cost (INR)"/>
                          </mx:columns>
                </mx:AdvancedDataGrid>
      </s:TitleWindow>
      
      

       

      Grid is successfully created but when I click on the "airlines" which is my grouping field it gives me Reference Error saying that property assets/somelogo.jpg not found....

        • 1. Re: Grouping in Advance datagrid component
          jfb00 Level 3

          Hi,

          Where is your "airline" button? I don't see it here. Maybe is in the parent application, there it should be a reference for this logo.jpg image that it is missing.

          Best

          • 2. Re: Grouping in Advance datagrid component
            tejzify Level 1

            Hi jfb00,

             

                 The "airline" is not a button, but it is the result of grouping. I have "city" as an array collection which has type as property, now type contains "hotel" and "airlines". Now as I have grouped on type, when I run the grid is created and I can see two nodes with labels "airline" and "hotel" in the grid. When I try to expand any of the node it gives me error as I have discussed earlier.