Warning: Creating default object from empty value in /home/agilemed/aendeavors.com/wp-includes/ms-load.php on line 138

Warning: session_start(): Cannot send session cookie - headers already sent by (output started at /home/agilemed/aendeavors.com/wp-includes/ms-load.php:138) in /home/agilemed/aendeavors.com/wp-content/plugins/amazon-product-in-a-post-plugin/amazon-product-in-a-post.php on line 102

Warning: session_start(): Cannot send session cache limiter - headers already sent (output started at /home/agilemed/aendeavors.com/wp-includes/ms-load.php:138) in /home/agilemed/aendeavors.com/wp-content/plugins/amazon-product-in-a-post-plugin/amazon-product-in-a-post.php on line 102
Adobe Flex: WebService XML Array Binding, Value-Enabled ComboBox » Agile Tech

«

»

Apr
26

Adobe Flex: WebService XML Array Binding, Value-Enabled ComboBox

While working on a new application using Adobe Flex, one shortcoming of the ComboBox was readily apparent: there is no way to store a value and display a different string like one can do with HTML:

   1: <SELECT>

   2:   <OPTION value="123">First String</OPTION>

   3:   <OPTION value="124">Second String</OPTION>

   4:   <OPTION value="125">Third String</OPTION>

   5: </SELECT>

While browsing the internet, there were several pages that either made a custom ComboBox to store the data, or went through a decent amount of loops and arrays. One other task that was difficult was trying to use the HTTPService to bind XML data to an array.

HTTPService to Array

This solution doesn’t bind directly to an array, but uses the XMLListCollection instead, which works similar to an ArrayCollection. The HTTPService is set up like the main examples for binding to other objects:

   1: <mx:HTTPService id="xmlList"

   2:     url="http://www.mywebserver.com/webService.php"

   3:     result="handleXml(event)"

   4:     fault="handleFault(event)"

   5:     resultFormat="e4x">

   6:     <mx:request>

   7:         <type>{requestedType}</type>

   8:         <format>{requestedFormat}</format>

   9:     </mx:request>

  10: </mx:HTTPService>

To set this data to an array (or in this case an XMLListCollection):

   1: private var myXmlCollection:XMLListCollection;

   2:

   3: public function handleXml(event:ResultEvent):void{

   4:     if(event.result != ""){

   5:         // Set the data to the XMLListCollection for lookup

   6:         myXmlCollection= new XMLListCollection(event.result.node);

   7:         // Bind the ListCollection to the comboBox

   8:         myComboBox.dataProvider = myXmlCollection;

   9:     }

  10: }

Use XMLListCollection for Value-Enabled ComboBox

To have the ComboBox use the current ID when we change it, we then use the “change” attribute:

   1: <mx:Label text="My List Data: "

   2:        x="10" y="40"/>

   3: <mx:ComboBox id="xmlList"

   4:     x="60" y="38"

   5:     width="250"

   6:     labelField="description"

   7:     change="getCurrentId()" />

And finally, we lookup our current value/ID:

   1: public function getCurrentId():void{

   2:     var o:Object = myXmlCollection.getItemAt(xmlList.selectedIndex);

   3:     var currentId:String = o.nodeid.toString();

   4:     // Do whatever we want with our selected ID

   5: }

This can then be used to update other combo boxes (such as displaying a list of cities once a state is selected) or any other tasks where your ID and display value may differ for UI reasons.

2 pings

  1. WordPress.Net - Wordpress 201 says:

    [...] Adobe Flex: WebService XML Array Binding, Value-Enabled ComboBox … [...]

  2. WordPress.Net - Wordpress Video Tutorials says:

    [...] Adobe Flex: WebService XML Array Binding, Value-Enabled ComboBox … [...]

Leave a Reply

Your email address will not be published.


*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>