8 Replies Latest reply on May 26, 2006 2:23 AM by poonamsheth

    getting data into the dataGrid

    truly_great Level 1
      I am accessing data from an XML file and trying to put it into a dataGrid. I have traced it and know its there, but I can't seem to get it to actually show in the grid itself.

      I have declared the variables that I want from the XML file, have set up the initialization, array collection, and the dataGrid; but I must be missing one thing because the data won't show inside the grid.

      I tried importing the mx.data.DataService controls but they kept giving me errors. The tutorial in the Flex help file is less than helpful. How do I get data into the grid?

      TIA

      Thia
        • 1. Re: getting data into the dataGrid
          GordonSmith Level 4
          Are you setting the dataProvider property of the DataGrid somehow?
          • 2. Re: getting data into the dataGrid
            ntsiii Level 3
            And are you specifying dataField or labelFunction for each column?

            Tracy
            • 3. Re: getting data into the dataGrid
              truly_great Level 1
              Yes, I have done both of those;

              <mx ataGrid x="20" y="40" height="192" id="rssGrid" editable="false" enabled="true" width="465" dataProvider="{rssList}">

              I have specified the dataField for each column.

              When I click the button that is supposed to access the rssfeed, I see that it is transferring data, so I obviously must not have binded it correctly. I binded the 3 items I needed, I also created a function that put the rssGrid and the data together.

              Not sure what I need to do now
              • 4. Re: getting data into the dataGrid
                Level 7
                What type is rssList? How is it getting set?


                • 5. Re: getting data into the dataGrid
                  ntsiii Level 3
                  If you are sure you are getting data back, but the dg does not display it, it is almost always because the structure of your result data is not exactly what you think it is. (which makes your binding references incorrect.)

                  Instead of binding, which is hard to debug, set up a result handler and call it from the result event of the data service.

                  In that handler, use debugging techniques to examine the event.lastResult object. toString and valueOf should be very helpful.

                  Another debug technique is to use a labelFunction that just returns the same string everytime. If you get a display of the correct number of rows with the constant string in it, you have determined that the item property references are indeed the problem.

                  Tracy
                  • 6. Re: getting data into the dataGrid
                    ckshah Level 1
                    hi,

                    u can access xml file this way
                    <mx:HTTPService id="srv" url="catalog.xml" useProxy="false"
                    result="employeesOrg = new ArrayCollection(srv.lastResult.catalog.product)"/>

                    <mx:script>
                    import mx.collections.ArrayCollection;
                    import mx.collections.IList;

                    [Bindable]
                    public var employeesOrg:IList;

                    employeesOrg.addItem( {name: 'ttt', price: '0.5'} );
                    </mx:script>

                    and bind this array with datagrid
                    <mx ataGrid id="srcgrid" width="100%" dataProvider="{employeesOrg}" x="4" y="42">
                    <mx:columns>
                    <mx:Array>
                    <mx ataGridColumn dataField="name" headerText="Name" width="140"/>
                    <mx ataGridColumn dataField="price" headerText="Price" width="80"/>
                    </mx:Array>
                    </mx:columns>
                    </mx ataGrid>

                    and send http request in application or any component using creationComplete event

                    this way
                    creationComplete=srv.send();


                    if u r using flex2.0 beta2 or lower then u have to set
                    result to lastresult
                    result="employeesOrg = new ArrayCollection(srv.Result.catalog.product)"/>

                    else it will work well in beta3

                    i hope this will help u a lot
                    • 7. Re: getting data into the dataGrid
                      ckshah Level 1
                      hi,

                      u can access xml file this way
                      <mx:HTTPService id="srv" url="catalog.xml" useProxy="false"
                      result="employeesOrg = new ArrayCollection(srv.lastResult.catalog.product)"/>

                      <mx:script>
                      import mx.collections.ArrayCollection;
                      import mx.collections.IList;

                      [Bindable]
                      public var employeesOrg:IList;

                      employeesOrg.addItem( {name: 'ttt', price: '0.5'} );
                      </mx:script>

                      and bind this array with datagrid
                      <mx ataGrid id="srcgrid" width="100%" dataProvider="{employeesOrg}" x="4" y="42">
                      <mx:columns>
                      <mx:Array>
                      <mx ataGridColumn dataField="name" headerText="Name" width="140"/>
                      <mx ataGridColumn dataField="price" headerText="Price" width="80"/>
                      </mx:Array>
                      </mx:columns>
                      </mx ataGrid>

                      and send http request in application or any component using creationComplete event

                      this way
                      creationComplete=srv.send();


                      if u r using flex2.0 beta2 or lower then u have to set
                      result to lastresult
                      result="employeesOrg = new ArrayCollection(srv.Result.catalog.product)"/>

                      else it will work well in beta3

                      i hope this will help u a lot
                      • 8. Re: getting data into the dataGrid
                        poonamsheth Level 1
                        there is one more example with me,, which uses itemrenderer concept.
                        its great to work with,,
                        its nothing but a custom component class, which is said to be itemrenderer in tree concept.
                        in this program my datagrid uses itemrenderer component to acess the list data,
                        (might be its not related to the problem u said, but would give u different idea to get a very similar output u wanted)

                        Item renderers do not impose restrictions on the types of Flex components that you can use in them. For example, you can use controls, such as the Label, LinkButton, Button, and Text controls to display data, but these controls do not let the user modify the contents of the control.

                        Or, you can use controls such as the CheckBox, ComboBox, and TextInput controls that both display data and let users interact with the control to modify or change it. For example, you could use a CheckBox control to display a selected (true value) or unselected (false value) cell in a DataGrid control.

                        When the user selects the cell of the DataGrid control that contains the CheckBox control, the user can interact with the control to change its state. To the user, it appears that the DataGrid control is editable.

                        However, an item renderer by default is not connected to the editing mechanism of the list control; it does not propagate changes to the list control's data provider, nor does it dispatch an event when the user modifies the cell. Although the list control appears to the user to be editable, it really is not.

                        main.mxml
                        ---------------
                        <?xml version="1.0"?>
                        <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" xmlns:local="*">

                        <mx:Script>
                        <![CDATA[
                        [Bindable]
                        public var initDG:Array = [
                        {Contact: 'Rajesh', Company: 'Oinam',
                        Phone: '101', Project: 'Flex'},
                        {Contact: 'Mujesh', Company: 'Oinam',
                        Phone: '102', Project: 'Flex'},
                        {Contact: 'Ashok', Company: 'Oinam',
                        Phone: '103', Project: 'Flex'},
                        {Contact: 'Bose', Company: 'Oinam',
                        Phone: '104', Project: 'Flex'},
                        {Contact: 'Suraj', Company: 'Oinam',
                        Phone: '105', Project: 'Photoshop'} ];
                        ]]>
                        </mx:Script>

                        <mx ataGrid id="Main" dataProvider="{initDG}"
                        variableRowHeight="true" width="464">
                        <mx:columns>
                        <mx ataGridColumn dataField="Company"
                        itemRenderer="RendererDGListData"/>
                        <mx ataGridColumn dataField="Contact"
                        itemRenderer="RendererDGListData"/>
                        <mx ataGridColumn dataField="Phone"
                        itemRenderer="RendererDGListData"/>
                        <mx ataGridColumn dataField="Date"
                        itemRenderer="RendererDGListData"/>
                        </mx:columns>
                        </mx ataGrid>
                        </mx:Application>
                        ------------------------------

                        RendererDGListData.mxml
                        ----------------------------------------
                        <?xml version="1.0"?>
                        <mx:TextArea xmlns:mx=" http://www.adobe.com/2006/mxml"
                        preinitialize ="init();">

                        <mx:Script>
                        <![CDATA[

                        import mx.controls.dataGridClasses.DataGridListData;
                        import flash.events.Event;

                        public function init():void
                        {
                        addEventListener("dataChange", handleDataChanged);
                        }

                        public function handleDataChanged(event:Event):void
                        {
                        // putting listData in datagrid
                        var myListData ataGridListData = DataGridListData(listData);

                        // Access data passed to the item renderer.
                        text="row : " + String(myListData.rowIndex) +
                        " column : " + String(myListData.columnIndex);
                        }
                        ]]>
                        </mx:Script>
                        </mx:TextArea>
                        ------------------------

                        bye.