常用Flex验证控件用法指导

 本文和大家重点讨论一下常用Flex验证控件的用法,主要包括主要包括Flex验证控件的必填项,检测时机的控制,验证失败时如何处理和批量验证等内容,相信通过本文的学习你对Flex验证控件的用法一定会有深刻的认识。

成都创新互联专注于玉龙网站建设服务及定制,我们拥有丰富的企业做网站经验。 热诚为您提供玉龙营销型网站建设,玉龙网站制作、玉龙网页设计、玉龙网站官网定制、小程序设计服务,打造玉龙网络公司原创品牌,更为您提供玉龙网站排名全网营销落地服务。

常用Flex验证控件

1.验证必填项

代码如下:

 
 
 

 Validator组件的功能是检测必填项。我们把要检测的组件的名字写在source属性中,把要检测的组件的属性写在property属性中,然后自定义requiredFieldError属性的值即可。当然requiredFieldError属性的值也可以不定义,那么就会使用默认的提示文字。

上面的错误提示的文字有些看不清,只需要加上这样一句就OK了:

 
 
 
  1. .errorTip
  2. {
  3. fontSize:12;
  4. }

 2.控制Flex验证控件检测时机

默认的情况下,Flex当我们切换组件焦点的时候检测
任意动作触发验证有两种写法。一种是在验证组件中指明触发器和触发动作。另一种是执行事件处理函数。
在验证组件中指明触发器和触发动作的语法如下所示。

 
 
 
  1. source="{输入源id}"
  2. property="输入源的属性"
  3. trigger="{触发器}"
  4. triggerEvent="触发事件">

 下面这个例子为按Tab键切换焦点已经不能触发检测动作了,只有单击“提交”按钮才会触发检测。

 
 
 
  1. requiredFieldError="必须输入姓名!"
  2. trigger="{btn}"triggerEvent="click"/>
  3. requiredFieldError="必须输入年龄!"
  4. trigger="{btn}"triggerEvent="click"/>

 在默认情况下,Validator会在Flex发出valueCommit事件的时候进行检测,因此当焦点改变的时候,会自动进行检测。而上面的源码中,则手动指定了进行检测的事件是btn按钮的click事件。

任意动作的触发也可采用代码触发验证方式。
其语法如下所示。
<组件事件="验证组件.validate();"/>
验证组件都包含一个validate方法,用以代码执行验证。
比如:
#p#

3.Flex验证控件验证失败处理

验证失败时需要做错误的提示及处理。验证组件中提供了丰富的错误类型,只是这些错误类型的提示是英文的,用户可能需要改变提示。修改错误提示的方法是修改组件中相应的错误类型属性。例PhoneNumberValidator组件中的wrongLengthError属性表示长度错误提示。
用户可根据需要修改相应的出错信息。其语法如下所示。
<验证组件错误类型属性="自定义错误提示"/>

例:

 
 
 
  1. //引用ValidationResultEvent类
  2. importmx.events.ValidationResultEvent;
  3. privatefunctioncheckHandle():void//验证处理函数
  4. {
  5. if(emailV.validate().type==ValidationResultEvent.VALID)
  6. {
  7. Alert.show("电子邮件验证成功");//提示"验证成功"
  8. }
  9. }

 注:
If(验证组件id.validate().type==ValidationResultEvent.VALID)
ValidationResultEvent类包含于“mx.events.*”中,是验证结果事件类。其中,INVALID值表示验证失败,VALID值表示验证成功。

Validator还有一个listen属性,它用来指定检测的错误信息显示在哪个组件上。例:

 
 
 
  1. requiredFieldError="必须输入姓名!"
  2. trigger="{btn}"triggerEvent="click"/>
  3. requiredFieldError="必须输入年龄!"
  4. trigger="{btn}"triggerEvent="click"/>
  5. requiredFieldError="必须选择性别!"
  6. trigger="{btn}"triggerEvent="click"
  7. listener="{maleRB}"/>

对于性别的选择,由于检测两个RadioButton比较麻烦,采用了检测RadioButtonGroup的selectedValue属性的方法,如果这个属性为空,就说明两个RadioButton都没有选择。但RadioButtonGroup并不是一个可视组件,检测的错误信息无法显示出来,所以这里就使用了listen属性将显示信息转到maleRB组件上进行显示了。#p#

4.批量Flex验证控件验证

创建一个表单

 
 
 

 创建Flex验证控件,放在数组里

 
 
 
  1. source="{roleName}"property="text"
  2. required="true"requiredFieldError="请输入角色名"/>

通过数组,创建组合验证

 
 
 
  1. tooShortError="字符串太短了,请输入最少1个字符."
  2. tooLongError="字符串太长了,请输入最长10个字符."
  3. minLength="1"maxLength="10"/>
  4. source="{roleEnName}"property="text"
  5. flags="g,i"expression="^[a-z]+$"
  6. noMatchError="请输入正确的英文字母"
  7. required="false"/>

 //代码

 
 
 
  1. privatefunctionbtnSubmit_click():void{
  2. //分别检测验证是否通过,如果没有通过,则通过派发事件,主动显示错误提示
  3. if(Validator.validateAll(roleEnNameValidators).length!=0)
  4. roleEnName.dispatchEvent(newMouseEvent(MouseEvent.MOUSE_OVER));
  5. elseif(Validator.validateAll(roleNameValidators).length!=0)
  6. roleName.dispatchEvent(newMouseEvent(MouseEvent.MOUSE_OVER));
  7. else
  8. {
  9. varpar:powerModule=this.owneraspowerModule;
  10. par.roleList.addItem({label:"大三辅导员",data:"3"});
  11. varmodel:RoleModel=newRoleModel();
  12. model.roleName="大三辅导员";
  13. model.roleEnName="daisan";
  14. model.roleID=par.personVo.departID+"."+model.roleEnName;
  15. model.ysxh="010200";
  16. model.roleDescribe="测试用的";
  17. AddRoleResult.token=roleService.add(model);
  18. }
  19. }

当前题目:常用Flex验证控件用法指导
URL链接:http://www.hantingmc.com/qtweb/news43/247993.html

网站建设、网络推广公司-创新互联,是专注品牌与效果的网站制作,网络营销seo公司;服务项目有等

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联