Change form control property in state
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute">
<mx:Script>
import mx.effects.easing.Bounce;
</mx:Script>
<mx:states>
<mx:State name="bookDetails" basedOn="">
<mx:AddChild relativeTo="{bookForm}" position="lastChild" creationPolicy="all">
<mx:FormItem id="isbn" label="new Label" />
</mx:AddChild>
<mx:SetProperty target="{title}" name="text" value="New Details" />
<mx:RemoveChild target="{bookLink}" />
</mx:State>
</mx:states>
<mx:transitions>
<mx:Transition fromState="*" toState="*">
<mx:Parallel targets="{[book, bookLink, title, isbn]}">
<mx:Resize duration="5000" easingFunction="Bounce.easeOut" />
</mx:Parallel>
</mx:Transition>
</mx:transitions>
<mx:Panel title="XML Book" id="book" horizontalScrollPolicy="off" verticalScrollPolicy="off">
<mx:Form id="bookForm">
<mx:FormItem label="Label 1" fontWeight="bold" />
<mx:FormItem label="Label 2" fontStyle="italic" />
</mx:Form>
<mx:ControlBar>
<mx:LinkButton label="Click" id="bookLink" click="currentState = 'bookDetails' " />
<mx:Spacer width="100%" id="spacer1" />
<mx:Label text="Title" id="title" />
</mx:ControlBar>
</mx:Panel>
</mx:Application>
Related examples in the same category