Question

probably a newbie question, but after looking through the ‘net, still cannot find an answer… I have an XML object like this:

<questionpools>
 <questionpool id="1">
  <name>Sample test bank</name>
  <description>This is a Sample test bank description</description>
  <createdate>2010.10.10</createdate>
  <moddate>2010.10.11</moddate>
  <createdby>testuser</createdby>
  <modby>testuser</modby>
</questionpool>
<questionpool id="2">
  <name>alme</name>
  <description>newpool</description>
  <createdate>2010.10.31</createdate>
  <moddate>2010.10.31</moddate>
  <createdby>testuser</createdby>
  <modby>testuser</modby>
</questionpool>
<questionpool id="9">
  <name>pool_new</name>
  <description>newpool</description>
  <createdate>2010.10.31</createdate>
  <moddate>2010.10.31</moddate>
  <createdby>testuser</createdby>
  <modby>testuser</modby>
</questionpool>

I load this file to an XML variable:

var poolMenuXML:XMLList = questionpoolsXML.questionpools;
poolMenu = new XMLListCollection(poolMenuXML.children());

and bind the ‘name’ node to a dropdown’s label field

<s:DropDownList id="s_poolnumber" dataProvider="{poolMenu}" labelField="name"></s:DropDownList>

but how to add the id attribute as the ‘data’ field of the dropdown so when an item is selected, it returns that field?

Shall I create a custom component that uses the @id attribute as the source of the ‘data’ values? (I’ve also tried to add a node thinking that might help but unfortunately that does not work either…)

thanks
peter

Answer 1

Pass whole object and fetch id attribute later. See onDropDownListChange method

<?xml version="1.0" encoding="utf-8"?>
<s:Application 
    minHeight="600"
    minWidth="955"
    creationComplete="application1_creationCompleteHandler(event)"
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:mx="library://ns.adobe.com/flex/mx">

    <fx:Script>
        <![CDATA[
            import mx.collections.XMLListCollection;
            import mx.events.FlexEvent;

            import spark.events.IndexChangeEvent;

            [Bindable] private var poolMenu:XMLListCollection;

            private var questionpoolsXML:XML = <questionpools>
                    <questionpool id="1">
                        <name>Sample test bank</name>
                        <description>This is a Sample test bank description</description>
                        <createdate>2010.10.10</createdate>
                        <moddate>2010.10.11</moddate>
                        <createdby>testuser</createdby>
                        <modby>testuser</modby>
                    </questionpool>
                    <questionpool id="2">
                        <name>alme</name>
                        <description>newpool</description>
                        <createdate>2010.10.31</createdate>
                        <moddate>2010.10.31</moddate>
                        <createdby>testuser</createdby>
                        <modby>testuser</modby>
                    </questionpool>
                    <questionpool id="9">
                        <name>pool_new</name>
                        <description>newpool</description>
                        <createdate>2010.10.31</createdate>
                        <moddate>2010.10.31</moddate>
                        <createdby>testuser</createdby>
                        <modby>testuser</modby>
                    </questionpool>
                </questionpools>;

            private function application1_creationCompleteHandler(event:FlexEvent):void
            {
                poolMenu = new XMLListCollection(questionpoolsXML.children());
            }

            private function onDropDownListChange(event:IndexChangeEvent):void
            {
                trace(s_poolnumber.selectedItem.@id);
            }
        ]]>
    </fx:Script>

    <s:DropDownList id="s_poolnumber"
        dataProvider="{poolMenu}"
        labelField="name"
        change="onDropDownListChange(event)"/>
</s:Application>