Flex驗(yàn)證控件如何使用,相信很多沒有經(jīng)驗(yàn)的人對此束手無策,為此本文總結(jié)了問題出現(xiàn)的原因和解決方法,通過這篇文章希望你能解決這個問題。

我們提供的服務(wù)有:成都網(wǎng)站制作、成都網(wǎng)站設(shè)計(jì)、外貿(mào)營銷網(wǎng)站建設(shè)、微信公眾號開發(fā)、網(wǎng)站優(yōu)化、網(wǎng)站認(rèn)證、青河ssl等。為上千家企事業(yè)單位解決了網(wǎng)站和推廣的問題。提供周到的售前咨詢和貼心的售后服務(wù),是有科學(xué)管理、有技術(shù)的青河網(wǎng)站制作公司
1.驗(yàn)證必填項(xiàng)
代碼如下:
<mx:Validatoridmx:Validatorid="nameV"source="{nameTI}"property="text"requiredFieldError="必須輸入用戶名!"/> <mx:FormItemlabelmx:FormItemlabel="用戶名:"> <mx:TextInputidmx:TextInputid="nameTI"/> </mx:FormItem> <mx:Buttonidmx:Buttonid="btn"label="提交"/>Validator組件的功能是檢測必填項(xiàng)。我們把要檢測的組件的名字寫在source屬性中,把要檢測的組件的屬性寫在property屬性中,然后自定義requiredFieldError屬性的值即可。當(dāng)然requiredFieldError屬性的值也可以不定義,那么就會使用默認(rèn)的提示文字。
上面的錯誤提示的文字有些看不清,只需要加上這樣一句就OK了:
<mx:Style> .errorTip { fontSize:12; } </mx:Style>2.控制Flex驗(yàn)證控件檢測時機(jī)
默認(rèn)的情況下,F(xiàn)lex當(dāng)我們切換組件焦點(diǎn)的時候檢測
任意動作觸發(fā)驗(yàn)證有兩種寫法。一種是在驗(yàn)證組件中指明觸發(fā)器和觸發(fā)動作。另一種是執(zhí)行事件處理函數(shù)。
在驗(yàn)證組件中指明觸發(fā)器和觸發(fā)動作的語法如下所示。
<mx:驗(yàn)證組件類型 source="{輸入源id}" property="輸入源的屬性" trigger="{觸發(fā)器}" triggerEvent="觸發(fā)事件">下面這個例子為按Tab鍵切換焦點(diǎn)已經(jīng)不能觸發(fā)檢測動作了,只有單擊“提交”按鈕才會觸發(fā)檢測。
<?xmlversionxmlversion="1.0"encoding="utf-8"?> <mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="vertical"fontSize="12"width="300"height="150"> <mx:Validatoridmx:Validatorid="nameV"source="{nameTI}"property="text" requiredFieldError="必須輸入姓名!" trigger="{btn}"triggerEvent="click"/> <mx:Validatoridmx:Validatorid="ageV"source="{ageTI}"property="text" requiredFieldError="必須輸入年齡!" trigger="{btn}"triggerEvent="click"/> <mx:FormItemlabelmx:FormItemlabel="姓名:"> <mx:TextInputidmx:TextInputid="nameTI"/> </mx:FormItem> <mx:FormItemlabelmx:FormItemlabel="年齡:"> <mx:TextInputidmx:TextInputid="ageTI"/> </mx:FormItem> <mx:Buttonidmx:Buttonid="btn"label="提交"/> </mx:Application>在默認(rèn)情況下,Validator會在Flex發(fā)出valueCommit事件的時候進(jìn)行檢測,因此當(dāng)焦點(diǎn)改變的時候,會自動進(jìn)行檢測。而上面的源碼中,則手動指定了進(jìn)行檢測的事件是btn按鈕的click事件。
任意動作的觸發(fā)也可采用代碼觸發(fā)驗(yàn)證方式。
其語法如下所示。
<組件事件="驗(yàn)證組件.validate();"/>
驗(yàn)證組件都包含一個validate方法,用以代碼執(zhí)行驗(yàn)證。
比如:
<mx:Buttonid="btn"label="提交"click="nameV.validate();"/>
3.Flex驗(yàn)證控件驗(yàn)證失敗處理
驗(yàn)證失敗時需要做錯誤的提示及處理。驗(yàn)證組件中提供了豐富的錯誤類型,只是這些錯誤類型的提示是英文的,用戶可能需要改變提示。修改錯誤提示的方法是修改組件中相應(yīng)的錯誤類型屬性。例PhoneNumberValidator組件中的wrongLengthError屬性表示長度錯誤提示。
用戶可根據(jù)需要修改相應(yīng)的出錯信息。其語法如下所示。
<驗(yàn)證組件錯誤類型屬性="自定義錯誤提示"/>
例:
//引用ValidationResultEvent類 importmx.events.ValidationResultEvent; privatefunctioncheckHandle():void//驗(yàn)證處理函數(shù) { if(emailV.validate().type==ValidationResultEvent.VALID) { Alert.show("電子郵件驗(yàn)證成功");//提示"驗(yàn)證成功" } } <!--按鈕組件,用于驗(yàn)證處理--> <mx:Buttonidmx:Buttonid="mySubmit"label="驗(yàn)證"click="checkHandle();"/>注:
If(驗(yàn)證組件id.validate().type==ValidationResultEvent.VALID)
ValidationResultEvent類包含于“mx.events.*”中,是驗(yàn)證結(jié)果事件類。其中,INVALID值表示驗(yàn)證失敗,VALID值表示驗(yàn)證成功。
Validator還有一個listen屬性,它用來指定檢測的錯誤信息顯示在哪個組件上。例:
<?xmlversionxmlversion="1.0"encoding="utf-8"?> <mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="vertical"fontSize="12"width="300"height="200"> <mx:Validatoridmx:Validatorid="nameV"source="{nameTI}"property="text" requiredFieldError="必須輸入姓名!" trigger="{btn}"triggerEvent="click"/> <mx:Validatoridmx:Validatorid="ageV"source="{ageTI}"property="text" requiredFieldError="必須輸入年齡!" trigger="{btn}"triggerEvent="click"/> <mx:Validatoridmx:Validatorid="sexV"source="{sexRBG}"property="selectedValue" requiredFieldError="必須選擇性別!" trigger="{btn}"triggerEvent="click" listener="{maleRB}"/> <mx:FormItemlabelmx:FormItemlabel="姓名:"width="150"> <mx:TextInputidmx:TextInputid="nameTI"/> </mx:FormItem> <mx:FormItemlabelmx:FormItemlabel="年齡:"width="150"> <mx:TextInputidmx:TextInputid="ageTI"/> </mx:FormItem> <mx:FormItemlabelmx:FormItemlabel="性別:"direction="horizontal"width="150"> <mx:RadioButtonGroupidmx:RadioButtonGroupid="sexRBG"/> <mx:RadioButtonidmx:RadioButtonid="maleRB"groupName="sexRBG"label="男"value="1"/> <mx:RadioButtonidmx:RadioButtonid="femaleRB"groupName="sexRBG"label="女"value="0"/> </mx:FormItem> <mx:Buttonidmx:Buttonid="btn"label="提交"/> </mx:Application>對于性別的選擇,由于檢測兩個RadioButton比較麻煩,采用了檢測RadioButtonGroup的selectedValue屬性的方法,如果這個屬性為空,就說明兩個RadioButton都沒有選擇。但RadioButtonGroup并不是一個可視組件,檢測的錯誤信息無法顯示出來,所以這里就使用了listen屬性將顯示信息轉(zhuǎn)到maleRB組件上進(jìn)行顯示了。
4.批量Flex驗(yàn)證控件驗(yàn)證
創(chuàng)建一個表單
<mx:Form> <mx:FormItemlabelmx:FormItemlabel="當(dāng)前部門:"> <mx:Textidmx:Textid="txtDepartName"width="100"/> </mx:FormItem> <mx:FormItemlabelmx:FormItemlabel="*新建角色名稱(至多10個漢字):"> <mx:TextInputidmx:TextInputid="roleName"width="100%"/> </mx:FormItem> <mx:FormItemlabelmx:FormItemlabel="*新建角色名稱(至多10個英文字母):"> <mx:TextInputidmx:TextInputid="roleEnName"width="100%"/> </mx:FormItem> <mx:FormItemlabelmx:FormItemlabel="角色描述(至多50個漢字):"> <mx:TextInputidmx:TextInputid="roleDescibe"width="100%"/> </mx:FormItem> <mx:ControlBar> <mx:Buttonidmx:Buttonid="btnSubmit"label="提交"click="btnSubmit_click()"/> <mx:Buttonidmx:Buttonid="btnClose"label="關(guān)閉"click="btnClose_click()"/> </mx:ControlBar>
創(chuàng)建Flex驗(yàn)證控件,放在數(shù)組里
<fx:Arrayidfx:Arrayid="roleNameValidators"> <mx:Validatoridmx:Validatorid="roleNameValidator" source="{roleName}"property="text" required="true"requiredFieldError="請輸入角色名"/> </fx:Array>通過數(shù)組,創(chuàng)建組合驗(yàn)證
<fx:Arrayidfx:Arrayid="roleEnNameValidators"> <mx:StringValidatorsourcemx:StringValidatorsource="{roleEnName}"property="text" tooShortError="字符串太短了,請輸入最少1個字符." tooLongError="字符串太長了,請輸入最長10個字符." minLength="1"maxLength="10"/> <mx:RegExpValidatoridmx:RegExpValidatorid="roleEnNameValidator" source="{roleEnName}"property="text" flags="g,i"expression="^[a-z]+$" noMatchError="請輸入正確的英文字母" required="false"/> </fx:Array> </fx:Declarations>//代碼
privatefunctionbtnSubmit_click():void{ //分別檢測驗(yàn)證是否通過,如果沒有通過,則通過派發(fā)事件,主動顯示錯誤提示 if(Validator.validateAll(roleEnNameValidators).length!=0) roleEnName.dispatchEvent(newMouseEvent(MouseEvent.MOUSE_OVER)); elseif(Validator.validateAll(roleNameValidators).length!=0) roleName.dispatchEvent(newMouseEvent(MouseEvent.MOUSE_OVER)); else { varpar:powerModule=this.owneraspowerModule; par.roleList.addItem({label:"大三輔導(dǎo)員",data:"3"}); varmodel:RoleModel=newRoleModel(); model.roleName="大三輔導(dǎo)員"; model.roleEnName="daisan"; model.roleID=par.personVo.departID+"."+model.roleEnName; model.ysxh="010200"; model.roleDescribe="測試用的"; AddRoleResult.token=roleService.add(model); } }看完上述內(nèi)容,你們掌握Flex驗(yàn)證控件如何使用的方法了嗎?如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!
網(wǎng)頁名稱:Flex驗(yàn)證控件如何使用
分享路徑:http://chinadenli.net/article36/jighpg.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供定制開發(fā)、ChatGPT、全網(wǎng)營銷推廣、外貿(mào)網(wǎng)站建設(shè)、動態(tài)網(wǎng)站、App開發(fā)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)