ユーザーがuserSAPno(数字である必要があります)とパスワード(最小8文字)を入力する簡単なログインフォームがあります。各フィールドの検証を行いました。状態をLoginMode_DefaultからPerviewMode状態に変更する前に、検証が最初に合格するかどうかを確認したいと思います。ユーザーがログインすると、ユーザーにウェルカムメッセージが表示されます。
私のコードでは、ユーザーがログインボタンをクリックしたときに、validateLogin()関数を呼び出して、フィールドが有効かどうかを確認します。有効な場合は、currentStateをPerviewMode状態に設定します。
PerviewModeでは、ユーザーはlogoutをクリックして、logoff()関数を呼び出してLoginMode_Default状態に戻すことができます。
ただし、ログアウトリンクをクリックすると、ログインフォームに戻りますが、userIdフィールドとpasswordフィールドの輪郭が赤で表示されます。フィールドの輪郭が赤くならずにログインフォームに戻るにはどうすればよいですか?私はそれを正しくやっていますか?これを行うためのより良いまたは正しい方法はありますか?plsは誰かがこれで私を助けることができますか?ありがとう:)
私の検証コード
<fx:Declarations>
<s:NumberValidator id="userSAPValidator"
property="text"
required="true"
domain="int"
notAnIntegerError="Should not conatin any decimal"
allowNegative="false"
negativeError="Should not contain negative values"
parseError="Enter only numbers without space"
source="{userSAP_field}"/>
<mx:StringValidator id="userPasswordValidator"
property="text"
required="true"
minLength="8"
tooShortError="password must at least be 8 characters"
source="{userPassword_field}"/>
</fx:Declarations>
MXMLでの私の状態:
<s:states>
<s:State name="LoginMode_Default"/>
<s:State name="PerviewMode"/>
</s:states>
私のログインフォームMXML:
<s:BorderContainer id="login_BC" x="1" y="1" width="223" height="134"
x.LoginMode_Default="2" y.LoginMode_Default="9"
height.LoginMode_Default="152" height.PerviewMode="40">
<s:Form id="loginForm" x="5" y="7" width="212" height="133"
x.LoginMode_Default="4" y.LoginMode_Default="5" excludeFrom="PerviewMode">
<s:layout>
<s:BasicLayout/>
</s:layout>
<s:Label x="0" y="14" width="52" height="18" text="SAP no :" paddingTop="5"/>
<s:TextInput id="userSAP_field" x="74" y="10" width="108"/>
<s:Label x="0" y="52" text="Password :" paddingTop="5"/>
<s:TextInput id="userPassword_field" x="73" y="48" width="109" height="21" displayAsPassword="true"/>
<s:Button id="loginButton" x="6" y="82" label="Login" click="validateLogin()" />
</s:Form>
<s:HGroup includeIn="PerviewMode" width="245" height="41">
<s:Label id="welcome_text" text="Welome your name" paddingTop="12" paddingLeft="10"/>
<mx:LinkButton label="logout" click="logOff()" paddingTop="6"/>
</s:HGroup>
</s:BorderContainer>
私のvalidateLogin関数:
private function validateLogin():void {
var vResult1:ValidationResultEvent;
var vResult2:ValidationResultEvent;
vResult1 = userPasswordValidator.validate();
vResult2 = userSAPValidator.validate();
if (vResult1.type==ValidationResultEvent.VALID && vResult2.type == ValidationResultEvent.VALID ) {
this.currentState = "PerviewMode";
}
else{
this.currentState = "LoginMode_Default";
}
}
私のlogOff関数:
private function logOff():void {
this.currentState = "LoginMode_Default";
userPassword_field.text ="";
userSAP_field.text ="";
}