2 Replies Latest reply on Oct 31, 2007 5:22 PM by ntsiii

    Populating Datagrid via http

    bisonj9
      Hi all,
      I am trying to populate a datagrid with data from an xml stored on my pc via http.The following is the code.As output, I see the components but no data in the datagrid.Can someone suggest how to achieve this with mxml tags.Thanks.

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="absolute" >
      <mx:HTTPService id="booklist" url=" http://localhost:8080/examples/books.xml" useProxy="false" />
      <mx:ApplicationControlBar dock="true">
      <mx:Panel title="Dataview" >
      <mx:TextInput/>
      <mx:Button label="Upload" />
      <mx:DataGrid dataProvider="{booklist}">
      <!--mx:ArrayCollection>
      <mx:Object>
      <mx:Artist>Pavement</mx:Artist>
      <mx:Price>11.99</mx:Price>
      <mx:Album>Slanted and Enchanted</mx:Album>
      </mx:Object>
      <mx:Object>
      <mx:Artist>Pavement</mx:Artist>
      <mx:Album>Brighten the Corners</mx:Album>
      <mx:Price>11.99</mx:Price>
      </mx:Object>
      </mx:ArrayCollection-->
      <mx:columns>
      <mx:DataGridColumn headerText="Author" dataField="author"/>
      <mx:DataGridColumn headerText="Title" dataField="title"/>
      <mx:DataGridColumn headerText="Genre" dataField="genre"/>
      <mx:DataGridColumn headerText="Price" dataField="price"/>
      <mx:DataGridColumn headerText="Date" dataField="publish_date"/>
      <mx:DataGridColumn headerText="Description" dataField="description"/>
      </mx:columns>
      </mx:DataGrid>
      </mx:Panel>
      </mx:ApplicationControlBar>

      </mx:Application>

      The xml is as follows

      <catalog>
      <book>
      <author> </author>
      <title> </title>
      <genre> </genre>
      <date> </date>
      <price> </price>
      <book>
      a few more book nodes

      </catalog>

        • 1. Re: Populating Datagrid via http
          ntsiii Level 3
          1)"booklist" is the id of the HTTPService tag, it does not and never will contain result data
          2) set resultFormat="e4x" on the HTTPService Tag.
          3) Use a result handler function so you can debug if needed.

          Below are some snippets you can use. You can ignore AsyncToken for now, bo go on and put it in the code like I have it, you will need it later.
          Tracy

          Sample code using HTTPService, e4x, handler function to populate a list item.
          Also shows usage of AsyncToken.

          The DataGrid tag:
          <mx:DataGrid id="dg" dataProvider="{_xlcMyListData}" .../>


          The HTTPService tag:
          <mx:HTTPService id="service" resultFormat="e4x" result="onResult(event)" fault="..../>

          Script block declaration:
          import mx.rpc.Events.ResultEvent;
          [Bindable]private var _xlcMyListData:XMLListCollection;

          Invoke send:
          var oRequest:Object = new Object();
          oRequest.Arg1 = "value1";
          var callToken:AsyncToken = service.send(oRequest);
          token.callId = "myQuery1";

          Result Handler function:
          private function onResult(oEvent:ResultEvent):void {
          var xmlResult:XML = XML(event.result); //converts result Object to XML. can also use "as" operator
          var xlMyListData:XMLList = xmlResult.myListData; //depends on xml format, is row data
          _xlcMyListData = new XMLListCollection(xlMyListData); //wrap the XMLList in a collection
          trace(_xlcMyListData.toXMLString()); //so you can see exactly how to specify dataField or build labelFunction
          var callToken:AsyncToken = oEvent.token;
          var sCallId = callToken.callId; //"myQuery1"
          switch(sCallId) { //Process the result conditionally
          case "myQuery1":
          doQuery2(); //do whatever. this example calls another data service query
          break;
          ...
          }
          }//onResult
          • 2. Re: Populating Datagrid via http
            ntsiii Level 3
            Also, since you are not sending any parameters to the url, you can ignore the "Invoke send:" section and, in a handler function on the application creationComplete event (or whenever you want, a button, etc), do:
            service.send(); //you must always call send to get the data.

            Tracy