CSC 2720 Building Web Applications

1. CSC 2720Building Web Applications FLEX –Working with Remote Data

2. Connecting with HTTP • Use HTTPService class to load any remote data via HTTP protocol • Steps: • Create an instance of HTTPService that maps to a URL. • Invoke the send() method to retrieve the remote file asynchronously. • Retrieve the loaded data via the lastResult property.

3. Loading an XML File <?xml version="1.0" encoding="utf-8"?> <students> <student name="John Doe" id="08123456" age="21" /> <student name="Jane Dow" id="08999111" age="18" /> <student name="Gary Brown" id="07111222" age="19" /> <student name="Amy White" id="07000001" age="20" /> </students> students.xml

4. <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="service.send()"> <mx:HTTPService id="service" url="students.xml" /> <mx:DataGrid dataProvider="{service.lastResult.students.student}" > </mx:DataGrid> </mx:Application> • service.lastResult.students.student is an array of objects with each object containing three properties – name, id, age. • The lastResult property holds the most recently retrieved data.

5. HTTPService's resultFormat Property <mx:HTTPService … resultFormat="object" /> • We can specify in what format the returned value should be using the property resultFormat. • Possible values are: "object", "array", "xml", "flashvars", "text", "e4x". • Default value is "object", which converts XML to a hierarchical list of ActionScript objects.

6. Retriving Results via a Handler Function <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="service.send()"> <mx:HTTPService url="students.xml" result="handleResult(event)" /> <mx:Script> <![CDATA[ import mx.rpc.events.ResultEvent; private function handleResult(e:ResultEvent):void { var resultObj: Object = e.result; … } ]]> </mx:Script> </mx:Application>

7. Passing Parameters to the Server <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="sendRequest()"> <mx:HTTPService id="service" url="getStudents.php" /> <mx:Script> <![CDATA[ private function sendRequest():void { var params: Object = new Object(); params.count = 10; // # of records params.min_age = 20; // minimum age service.send(params); // Use HTTP GET (default) } ]]> </mx:Script> </mx:Application>

8. References and Resources • Adobe Flex 3.0 For Dummies, by Doug McCune , Deepa Subramaniam. Wiley Publishing, Inc. 2008