Data Binding

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" verticalAlign="top"

    horizontalAlign="center" backgroundGradientColors="[#570A0A, #731F1F]" paddingTop="0" backgroundGradientAlphas="[1.0, 1.0]">

    <mx:Panel x="10" y="10" width="250" height="200" layout="absolute" color="#F7F9FA" title="Simple Binding">

        <mx:TextInput id="p1myTI" text="Type something here" x="35" y="20" color="#141313"/>

        <mx:Text id="p1myText" text="{p1myTI.text}" color="#141313" x="79" y="48"/>

        <mx:Text id="p1myTextUpper" text="{p1myTI.text.toUpperCase()}" color="#141313" x="55" y="72"/>

        <mx:Text id="p1myTextLength" text="{p1myTI.text.length}" color="#141313" x="59" y="96"/>

    </mx:Panel>

    <mx:Panel x="268" y="10" width="250" height="200" layout="absolute" color="#FFFFFF" title="Two Way Binding ">

                <mx:Text text="Type into either field" color="#090808" x="35" y="28"/>   

                <mx:TextInput id="p2myTI1" text="{p2myTI2.text}" x="35" y="84" color="#090808"/>

                <mx:TextInput id="p2myTI2" text="{p2myTI1.text}" x="35" y="54" color="#090808"/>

    </mx:Panel>

    <mx:Panel x="10" y="218" width="250" height="200" layout="absolute" color="#FFFFFF" title="&lt;mx:Binding&gt;">

                 <mx:TextInput id="p3myTI" text="Type something here" x="35" y="73" color="#0E0D0D"/>

                                 <mx:Text id="p3myText" color="#0E0D0D" x="35" y="45"/>     

    </mx:Panel>

     <mx:Binding source="p3myTI.text" destination="p3myText.text"/>

    <mx:Panel x="268" y="218" width="250" height="200" layout="absolute" title="Runtime Binding" color="#F7F9FA">

                <mx:Script>

        <![CDATA[

            import mx.binding.utils.*;

           

            // Define data binding.

            public function initBindingHandler():void {

            BindingUtils.bindProperty(myText, "text", myTI, "text");

            }

          ]]>   

    </mx:Script>

    <mx:TextInput id="myTI" text="Type something here" x="35" y="71" color="#0E0B0B"/>

    <mx:Text id="myText" preinitialize="initBindingHandler();" color="#0E0B0B" x="35" y="43"/>

    </mx:Panel>

   

    <mx:Panel x="526" y="101" width="250" height="200" layout="absolute" color="#FCFCFC" title="[Bindable]">

                 <mx:Script>

        <![CDATA[

            // Define public vars for tracking temps.

            [Bindable]

            public var highTemp:Number = 90;

   

            [Bindable]

            public var lowTemp:Number = 55;

        ]]>   

    </mx:Script>

   

    <mx:Text text="High: {highTemp}   Low: {lowTemp}" color="#000000" x="11" y="48"/>

    <mx:Button label="Winter Temps" click="highTemp=50; lowTemp=10;" y="74" x="62" color="#170606"/>

    <mx:Button label="Summer Temps" click="highTemp=95; lowTemp=80;" x="58" y="104" color="#170606"/>

    </mx:Panel>

</mx:Application>