Search Flex Components Free

Custom Search

January 1, 2008

Using a service with binding, validation, and event listeners

You can validate data before passing it to a service, and dispatch an event when the service returns a result or a fault. The following example shows an application that validates service request data and assigns an event listener to result and fault events.

This two-tier application does the following:

  1. Declares a web service.
  2. Binds user-interface data to a web service request.
  3. Validates a ZIP code.
  4. Binds data from a web service result to a user-interface control.
  5. Specifies result and fault event listeners for a WebService operation.

You can also create multitier applications that use an additional data-model layer between the user interface and the web service. For more information about data models and data binding, see Representing Data . For more information about data validation, see Validating Data .

<?xml version="1.0"?> <!-- fds\rpc\RPCBindValidateEvents.mxml. Compiles w destination error --> <mx:Application xmlns:mx="" width="600" height="400"> <!-- WebService component handles web service requests and results. --> <mx:WebService id="WeatherService" destination="wsDest"> <mx:operation name="GetWeather" fault="showErrorDialog(event.fault.faultString)" result="log();"> <!-- The mx:request data model stores web service request data. --> <mx:request> <ZipCode>{myZipField.text}</ZipCode> </mx:request> </mx:operation> </mx:WebService> <!-- Validator validates ZIP code using the standard Zip Code validator. --> <mx:ZipCodeValidator source="{WeatherService.GetWeather.request}" property="ZipCode" trigger="{mybutton}" triggerEvent="click"/> <mx:VBox> <mx:TextInput id="myZipField" text="enter zip" width="80"/> <!-- Button triggers service request. --> <mx:Button id="mybutton" label="Get Weather" click="WeatherService.GetWeather.send();"/> <!-- TextArea control displays the results that the service returns. --> <mx:TextArea id="temp" text="The current temperature in {WeatherService.GetWeather.lastResult.CityShortName} is {WeatherService.GetWeather.lastResult.CurrentTemp}." height="30" width="200"/> </mx:VBox> <mx:Script> <![CDATA[ public function log():void { // function implementation } public function showErrorDialog(error:String):void { // function implementation } ]]> </mx:Script> </mx:Application>

Related Flex Tutorials