Flex - How to bind XML children attribute values to dataProvider property of a DropDownList?

Question

Here is my sample XML for an XML document that consists of metadata about print templates:

<TemplateList>
    <PaperSizeTemplates PaperSize="8.5x14">
        <Template>Letter ANSI A Landscape</Template>
        <Template>Letter ANSI A Portrait</Template>
    </PaperSizeTemplates>
    <PaperSizeTemplates PaperSize="A3_11.5x16">
        <Template>A3 Landscape</Template>
        <Template>A3 Portrait</Template>
    </PaperSizeTemplates>
    <PaperSizeTemplates PaperSize="A4_8.5x11">
        <Template>A4 Portrait Custom</Template>
        <Template>A4 Portrait Custom1</Template>
        <Template>A4 Portrait Custom2</Template>
    </PaperSizeTemplates>
</TemplateList>

I have a spark DropDownList whose dataProvider I want to set such that the PaperSize attribute values for all PaperSizeTemplates elements display in the DropDownList.

For example, for the XML shown above, I want my DropDownList to display the following:

8.5x14
A3_11.5x16
A4_8.5x11

I tried the following:

<s:DropDownList id="paperSizeDDL" dataProvider="{_layoutTemplatesXML.paperSizeTemplates.paperSize as XMLListCollection}" />

but nothing appears in the drop down list.

Help on this would be greatly appreciated.

Please provide the correct way to do this using data binding and my example XML.

Thanks!

score 1 · Answer 1 · answered Nov 19 '12 at 17:48

Change the declaration to:

<s:DropDownList id="paperSizeDDL" dataProvider="{_layoutTemplatesXML.paperSizeTemplates as XMLListCollection}" labelField="@PaperSize" />

You may have to use the 'dataprovider' tag to specify the XML as XMLListCollection separately though. Since you haven't shown how the XML is provided I can only speculate.

score 1 · Answer 2 · answered Nov 19 '12 at 22:02

A couple things to consider when using E4X declarations:

Everything is case sensitive, so if you're looking for PaperSizeTemplates nodes, this must be referenced exactly. If you're root node declaration is assigned to a variable ie: var myXML = ... Then you're reference to the XMLList is myXML.PaperSizeTemplates
In your specific case you're actually looking for an attribute to a node -attributes use the @ symbol, so you're reference is myXML.PaperSizeTemplates.@PaperSize.

There is a section about XML-based data structures here that should help as a reference.

score 1 · Accepted Answer · answered Nov 19 '12 at 23:36

The other answers are somewhat on the mark, but won't work. Note that @Mike Petty's comment about matching the case in your e4x statements to the case used in the XML is one part of the problem.

However, the other issue is that e4x statements return XMLList objects. They don't return an XMLListCollection. So this expression evaluates to null:

_layoutTemplatesXML.PaperSizeTemplates as XMLListCollection

Instead, set the data provider for the drop down list like this:

<s:DropDownList dataProvider="{new XMLListCollection(_layoutTemplatesXML.PaperSizeTemplates.@PaperSize)}"/>

This populates the drop down list with 3 XML objects who's values are Strings for each size.

This worked perfectly! Thanks for explaining the importance of case-sensitivity. — BigSauce, Nov 26 '12 at 03:39

Flex - How to bind XML children attribute values to dataProvider property of a DropDownList?

3 Answers3