Accessibility

Table of Contents

Invoking .NET objects using the Flex RemoteObject API

Adding invocation logic

With the remote object declaration in place, you can add the invocation logic. The code in the following snippet contains three functions:

  1. A function where the remote invocation takes place (lines 9–12)
  2. Response handler (lines 14–17)
  3. Fault/exception handler (lines 19–22)

Additionally, there is a local variable of type TickerInfo that contains the latest response object (line 7). Notice the [Bindable] attribute right above the variable declaration. It is a special attribute that automatically wires any user interface (UI) component using the quote variable to the change events caused by the changes in the quote value. For example, when the .NET code returns a TickerInfo object, Flex invokes the gotServerData method. The method argument is a special event that carries the data that the .NET method returns. Method implementation casts the object to the ActionScript TickerInfo type and assigns the value to the quote variable (line 16). As a result of the assignment, the [Bindable] attribute will guarantee that all of the change events are sent to the UI components using the quote variable.

The next step is to wire the UI components to display the data:

  1. import mx.controls.Alert;
  2. import mx.rpc.events.FaultEvent;
  3. import com.examples.TickerInfo;
  4. import mx.rpc.events.ResultEvent;
  5. [Bindable]
  6. private var quote:TickerInfo;
  7. public function handleClick():void
  8. {
  9. tickerInfoService.getTickerInfo( symbolText.text );
  10. }
  11. public function gotServerData( event:ResultEvent ):void
  12. {
  13. quote = event.result as TickerInfo;
  14. }
  15. public function faultHandler( event:FaultEvent ):void
  16. {
  17. Alert.show( "Server reported an error " + event.fault.faultString, "Server Error" );
  18. }

To get the invocation in motion, invoke the handleClick function when the user clicks the "Get data" button. To do this, you must add an event handler to the button's markup:

<mx:Button x="228.5" y="19" label="Get data" width="67" click="handleClick()"/>

Wiring UI components to the data

The user interface displays the data from the server using four Label objects:

<mx:Label x="87" y="10" fontWeight="bold"/>
<mx:Label x="87" y="36" fontWeight="bold"/>
<mx:Label x="87" y="62" fontWeight="bold"/>
<mx:Label x="87" y="88" fontWeight="bold"/>

It is very easy to link the Label objects to the fields of the received TickerInfo object. Notice the bold text in the code below:

<mx:Label x="87" y="10" fontWeight="bold" text="{quote.lastPrice}"/>
<mx:Label x="87" y="36" fontWeight="bold" text="{quote.currentBid}"/>
<mx:Label x="87" y="62" fontWeight="bold" text="{quote.currentAsk}"/>
<mx:Label x="87" y="88" fontWeight="bold" text="{quote.lastPriceTimeStamp}"/>

Each Label component is configured to display a value of a corresponding field from the object stored in the local quote variable. Since the variable is Bindable, Flex automatically reflects any changes in the variable value in the user interface.