Bind field in Model to a Text control

          
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="vertical"
    creationComplete="initHandler();">

    <mx:Script>
        
            import mx.binding.utils.BindingUtils;
            private function initHandler():void
            {
                BindingUtils.bindProperty( lastNameField, "text",usermodel, ["name", "lastName"] );
            }
            private function clickHandler():void
            {
                usermodel.name.firstName = fNameInput.text;
                usermodel.name.lastName = lNameInput.text;
                usermodel.birth.date = dateInput.text;
            }
      
    </mx:Script>
    <mx:Model id="usermodel">
        <user>
            <name>
                  <firstName>A</firstName>
                  <lastName>B</lastName>
           </name>
           <birth>
                  <date>2101</date>
           </birth>
        </user>
    </mx:Model>
    <mx:Binding source="usermodel.birth.date" destination="dateField.text" />
    <mx:Form>
        <mx:FormItem label="First Name:">
            <mx:Text text="{usermodel.name.firstName}" />
     </mx:FormItem>
        <mx:FormItem label="Last Name:">
            <mx:Text id="lastNameField" />
        </mx:FormItem>
        <mx:FormItem label="Birthday:">
            <mx:Text id="dateField" />
        </mx:FormItem>
    </mx:Form>
    <mx:HRule />

    <mx:Form>
        <mx:FormItem label="First Name:">
             <mx:TextInput id="fNameInput" />
        </mx:FormItem>
        <mx:FormItem label="Last Name:">
            <mx:TextInput id="lNameInput" />
        </mx:FormItem>
        <mx:FormItem label="Birthday:">
            <mx:TextInput id="dateInput" />
        </mx:FormItem>
        <mx:FormItem label="Submit Changes">
             <mx:Button label="ok" click="clickHandler();" />
        </mx:FormItem>
    </mx:Form>
</mx:Application>

Related examples in the same category

1.	Model With Validator
2.	Use dot-delimited Strings with a nesting structure of elements
3.	Define a Flex data model that contains two values
4.	Combine binded data from Data Model
5.	Validate Model Data
6.	Script-based models
7.	Fill in data for Model
8.	Define and reference Model
9.	Referencing repeated data in Model
10.	Bind model to Text
11.	Bind whole expression from Model to a Text control
12.	Build Expression from data bind in Model
13.	Do calculation with binded Model data
14.	The tag
15.	An child tag with no value is considered null.
16.	Use validate() method to validate a Model object
17.	Get data from Model
18.	Loop through a Model
19.	Bind control's data to Model and use model data in another control
20.	Converting an MXML data model in an ActionScript object
21.	Validating a data model using the validate() method
22.	Model and binding
23.	A Flex data model that contains two values.
24.	TextModel Example
25.	An employee model declared in an tag:
26.	Model Tag Empty String

Bind field in Model to a Text control : Model « Data Model « Flex

Related examples in the same category