Use Bindable Property Chains
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:s="library://ns.adobe.com/flex/spark"
creationComplete="handleCreationComplete();">
<mx:Model id="userModel">
<user>
<name>
<firstName>A</firstName>
<lastName>B</lastName>
</name>
<birth>
<date>February 29th, 2010</date>
</birth>
</user>
</mx:Model>
<mx:Script>
import mx.binding.utils.BindingUtils;
private function handleCreationComplete():void{
BindingUtils.bindProperty( lastNameField, "text", userModel, ["name", "lastName"] );
}
private function handleClick():void{
userModel.name.firstName = fNameInput.text;
userModel.name.lastName = lNameInput.text;
userModel.birth.date = dateInput.text;
}
</mx:Script>
<mx:Binding source="userModel.birth.date" destination="dateField.text" />
<mx:Form borderStyle="solid">
<mx:FormItem label="First Name:">
<s:RichText text="{userModel.name.firstName}" />
</mx:FormItem>
<mx:FormItem label="Last Name:">
<s:RichText id="lastNameField" />
</mx:FormItem>
<mx:FormItem label="Birthday:">
<s:RichText id="dateField" />
</mx:FormItem>
</mx:Form>
<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="handleClick();" />
</mx:FormItem>
</mx:Form>
</mx:Application>
Related examples in the same category