fx:Bindinfx:Binding

http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf69084-7ccb.html

• Using an E4X expression in curly braces
• Using an E4X expression in an <fx:Binding> tag

A binding expression in curly braces or an <fx:Binding> tag can contain an ECMAScript for XML (E4X) expression when the source of a binding is a bindable property of type XML. You cannot use E4X when defining a data binding by using the BindingUtils.bindProperty() or the BindingUtils.bindSetter() method.

Using an E4X expression in curly braces

A binding expression in curly braces automatically calls the toString() method when the binding destination is a String property. A binding expression in curly braces or an<fx:Binding> tag can contain an ECMAScript for XML (E4X) expression when the source of a binding is a bindable property of type XML; for more information, see Using an E4X expression in an <fx:Binding> tag.

In the code in the following example, there are three binding expressions in curly braces that bind data from an XML object. The first uses . (dot) notation, the second uses .. (dot dot) notation, and the third uses || (or) notation.

<?xml version="1.0"?>

<!-- binding/E4XInBraces.mxml -->

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

xmlns:s="library://ns.adobe.com/flex/spark"

xmlns:mx="library://ns.adobe.com/flex/mx"

width="750">

<s:layout>

<s:HorizontalLayout/>

</s:layout>

 

<fx:Script>

<![CDATA[

 

[Bindable]

public var xdata:XML = <order>

<item id = "3456">

<description>Big Screen Television</description>

<price>1299.99</price><quantity>1</quantity>

</item>

<item id = "56789">

<description>DVD Player</description>

<price>399.99</price>

<quantity>1</quantity>

</item>

</order>;

]]>

</fx:Script>

 

<mx:Label text="Using .. notation."/>

<!-- Inline databinding will automatically call the

toString() method when the binding destination is a string. -->

<mx:List width="25%"

dataProvider="{xdata..description}"/>

 

<mx:Label text="Using . notation."/>

<mx:List width="25%"

dataProvider="{xdata.item.description}"/>

 

<mx:Label text="Using || (or) notation."/>

<mx:List width="25%"

dataProvider="{xdata.item.(@id=='3456'||@id=='56789').description}"/>

</s:Application>

Using an E4X expression in an <fx:Binding> tag

Unlike an E4X expression in curly braces, when you use an E4X expression in an <fx:Binding> tag, you must explicitly call the toString() method when the binding destination is a String property.

In the code in the following example, there are three binding expressions in curly braces that bind data from an XML object. The first uses . (dot) notation, the second uses .. (dot dot) notation, and the third uses || (or) notation.

<?xml version="1.0"?> 

<!-- binding/E4XInBindingTag.mxml --> 

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"  

    xmlns:s="library://ns.adobe.com/flex/spark"  

    xmlns:mx="library://ns.adobe.com/flex/mx"  

    width="600" height="900"> 

    <s:layout> 

        <s:VerticalLayout/> 

    </s:layout> 

 

    <fx:Script> 

        <![CDATA[ 

            [Bindable] 

            public var xdata:XML =  

                <order> 

                    <item id = "3456"> 

                        <description>Big Screen Television</description> 

                        <price>1299.99</price><quantity>1</quantity> 

                    </item> 

                    <item id = "56789"> 

                        <description>DVD Player</description> 

                        <price>399.99</price> 

                        <quantity>1</quantity> 

                    </item> 

                </order>;         

        ]]> 

    </fx:Script> 

 

    <mx:Label text="Using .. notation."/> 

 

    <!-- This will update because what is  

        binded is actually the String and XMLList. --> 

    <mx:List width="75%" id="txts"/> 

 

    <mx:Label text="Using . notation."/> 

    <mx:List width="75%" id="txt2s"/> 

 

    <mx:Label text="Using || (or) notation."/> 

    <mx:List width="75%" id="txt3s"/> 

 

    <fx:Binding  

        source="xdata..description"  

        destination="txts.dataProvider"/> 

    <fx:Binding  

        source="xdata.item.description"  

        destination="txt2s.dataProvider"/> 

    <fx:Binding  

        source="xdata.item.(@id=='3456'||@id=='56789').description"  

        destination="txt3s.dataProvider"/> 

</s:Application>