Hi

I'm presently learning Flex 3 and am building a simple application that allows
you to enter contact information to a registration page once the user has
correctly entered their login and password details.

What I don't understand is why my second 'registration' state doesn't appear.
I'm sure the answer is simple to those that know and even though there's a fair
bit of code below...those that know what the problem is will be able to spot
this quite quickly.

Many thanks in advance

H

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical" creationComplete="currentState='login'">

<mx:Model id="databaseFormDefaultText"
source="xml/databaseFormDefaultText.xml"/>
<mx:Model id="countryList" source="xml/countrylist.xml"/>
<mx:Style source="css/formStyles.css"/>
<mx:Style source="css/LinkButton.css"/>
<mx:ArrayCollection id="countriesArrColl" source="{countryList.item}"/>

<mx:Script>
<![CDATA[
import mx.controls.Text;
import mx.collections.*;
import flash.net.*;

private const BACKGROUND_COLOR:Object = "haloBlue";
private var defaultText:String;
private var res:Responder = new Responder(onResult, onFault);
private var gw:NetConnection = new NetConnection();

private function displayState(state:String):void {
this.currentState = state;
}

private function onNewRegistration(evt:Event):void {
trace("new registration");
this.currentState = "registration";
}

private function onFocus(evt:FocusEvent):void {
trace("onTextfieldFocus(default text):"+evt.currentTarget.text);
var item:FormItem = FormItem(evt.currentTarget.parent);
trace("evt.currentTarget.id:"+evt.currentTarget.id );
defaultText = databaseFormDefaultText[String(evt.currentTarget.id)];
trace("defaultText:"+defaultText);
if(evt.currentTarget.text == defaultText) {
evt.currentTarget.text = "";
}
evt.currentTarget.setStyle("color", 0x000000);
item.setStyle("backgroundAlpha", 0.2);
item.setStyle("backgroundColor", BACKGROUND_COLOR);
}



private function onFocusOut(evt:FocusEvent):void {
var item:FormItem = FormItem(evt.currentTarget.parent);
item.setStyle("backgroundColor", null);
if(evt.currentTarget.text == "") {
evt.currentTarget.setStyle("color", 0x999999);
evt.currentTarget.text = defaultText;
}
}

private function onResult(responds:Object):void {
trace("onResult:"+responds.result);
if(responds.result == "administrator access granted") {
trace("goto state registration "+this);
this.currentState = "registration";
}
}
private function onFault(responds:Object):void {
trace("onFault:");
for(var i:String in responds) {
trace("var "+i+" "+responds[i]);
}
}

private function onRegistration(evt:Event):void {
trace("onRegister");
for(var i:String in evt) {
trace("var "+i+" "+evt[i]);
}
trace("this:"+this);
}

private function onTextfieldFocus(evt:FocusEvent):void {
var item:FormItem = FormItem(evt.currentTarget.parent);
trace("item:"+item);
defaultText = databaseFormDefaultText[String(evt.currentTarget.id)];
trace("databaseFormDefaultText:"+databaseFormDefau ltText);
if(evt.currentTarget.text == defaultText) {
evt.currentTarget.text = "";
if(evt.currentTarget.name == "tf_password") {
evt.currentTarget.displayAsPassword = true;
}
}
evt.currentTarget.setStyle("color", 0x000000);
item.setStyle("backgroundAlpha", 0.2);
item.setStyle("backgroundColor", BACKGROUND_COLOR);
}

private function onTextfieldFocusOut(evt:FocusEvent):void {
var item:FormItem = FormItem(evt.currentTarget.parent);
item.setStyle("backgroundColor", null);
if(evt.currentTarget.text == "") {
evt.currentTarget.setStyle("color", 0x999999);
evt.currentTarget.text = defaultText;
}
}

private function onSubmit(evt:Event):void {
trace("onSubmit:");
gw.connect("http://localhost/flashservices/amfphp/ gateway.php");
gw.call("MySqlConnector.login", res, tf_login.text,
tf_password.text);
}

private function onRegSubmit(evt:Event):void {
trace("onRegSubmit:");
}

]]>
</mx:Script>


<mx:states>
<mx:State name="login">
<mx:AddChild creationPolicy="auto">
<mx:Panel id="loginPanel"
title="Enter your login and password"
paddingTop="0" paddingBottom="0"
paddingLeft="0" paddingRight="0">

<mx:Form id="form1">
<mx:FormItem label="Login:" id="fm_login">
<mx:TextInput id="tf_login" styleName='inputDefault'
focusIn="onTextfieldFocus(event)"
focusOut="onTextfieldFocusOut(event)" text="admin"/><!-- enter login-->
</mx:FormItem>
<mx:FormItem label="Password:" id="fm_password">
<mx:TextInput id="tf_password" displayAsPassword="false"
styleName='inputDefault'
focusIn="onTextfieldFocus(event)"
focusOut="onTextfieldFocusOut(event)" text="password"/><!-- enter password-->
</mx:FormItem>
</mx:Form>

<mx:ControlBar id="controlBar1">
<mx:Button id="button1" label="Submit" textAlign="right"
click="onSubmit(event)"/>
<mx:Spacer width="100%"/>
<mx:LinkButton label="register as new user" id="btn_registration"
click="onNewRegistration(event)"/>
</mx:ControlBar>

</mx:Panel>
</mx:AddChild>

</mx:State>

<mx:State name="registration">

<mx:RemoveChild target="{loginPanel}"/>
<mx:AddChild position="lastChild" creationPolicy="auto">

<mx:StringValidator id="vl_firstName" source="{firstName}" property="text"
trigger="{btn_submit}" triggerEvent="click"/>
<mx:StringValidator id="vl_secondName" source="{firstName}"
property="text" trigger="{btn_submit}" triggerEvent="click"/>
<mx:StringValidator id="vl_address1" source="{address1}" property="text"
trigger="{btn_submit}" triggerEvent="click"/>
<mx:StringValidator id="vl_address2" source="{address2}" property="text"
trigger="{btn_submit}" triggerEvent="click"/>
<mx:StringValidator id="vl_address3" source="{address3}" property="text"
trigger="{btn_submit}" triggerEvent="click"/>
<mx:StringValidator id="vl_postCode" source="{postCode}" property="text"
trigger="{btn_submit}" triggerEvent="click"/>

<mx:TitleWindow width="800" height="415" layout="absolute"
backgroundColor="#758F9B" verticalAlign="middle" horizontalAlign="center"
showCloseButton="false" title="Complete fields for database registration"
id="newRegistraton">
<mx:HBox width="100%" height="100%" x="4" y="4">

<mx:VBox width="50%" height="100%">

<mx:Form y="10" width="100%" height="364" id="contactsEntry" x="10">

<mx:FormItem label="First Name" width="325" required="false">
<mx:TextInput id="firstName" text="enter first name"
styleName='inputDefault' focusIn="onFocus(event)" focusOut="onFocusOut(event)">
</mx:TextInput>
</mx:FormItem>
<mx:FormItem label="Second Name" width="325">
<mx:TextInput id="secondName" text="enter second name"
styleName='inputDefault' focusIn="onFocus(event)" focusOut="onFocusOut(event)">
</mx:TextInput>
</mx:FormItem>
<mx:FormItem height="6">
<mx:Spacer height="2"/>
</mx:FormItem>
<mx:FormItem label="Address" width="325">
<mx:TextInput id="address1" text="enter address line 1"
styleName='inputDefault' focusIn="onFocus(event)" focusOut="onFocusOut(event)">
</mx:TextInput>
</mx:FormItem>
<mx:FormItem label="" width="325">
<mx:TextInput id="address2" text="enter address line 2"
styleName='inputDefault' focusIn="onFocus(event)" focusOut="onFocusOut(event)">
</mx:TextInput>
</mx:FormItem>
<mx:FormItem label="" width="325">
<mx:TextInput id="address3" text="enter address line 3"
styleName='inputDefault' focusIn="onFocus(event)" focusOut="onFocusOut(event)">
</mx:TextInput>
</mx:FormItem>
<mx:FormItem label="" width="325">
<mx:TextInput id="address4" text="enter address line 4"
styleName='inputDefault' focusIn="onFocus(event)" focusOut="onFocusOut(event)">
</mx:TextInput>
</mx:FormItem>
<mx:FormItem label="Post Code" width="325">
<mx:TextInput id="postCode" text="enter postcode"
styleName='inputDefault' focusIn="onFocus(event)" focusOut="onFocusOut(event)">
</mx:TextInput>
</mx:FormItem>
<mx:FormItem label="Label">
<mx:ComboBox id="country" dataProvider="{countriesArrColl}"
editable="false" enabled="true" width="160"></mx:ComboBox>
</mx:FormItem>

</mx:Form>

</mx:VBox>

<mx:VBox width="50%" height="100%">
<mx:Form width="100%" height="364">
<mx:FormItem label="Home telephone">
<mx:TextInput id="home" width="200" text="enter your home telephone"
styleName='inputDefault' focusIn="onFocus(event)" focusOut="onFocusOut(event)"/>
</mx:FormItem>
<mx:FormItem label="Mobile telephone">
<mx:TextInput id="mobile" width="200" text="enter your mobile
telephone" styleName='inputDefault' focusIn="onFocus(event)"
focusOut="onFocusOut(event)"/>
</mx:FormItem>
<mx:FormItem height="6">