java中必填项验证,FLEX常用验证控件 - Just Code - JavaEye技术网站

1.验证必填项

代码如下:

Flex代码

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

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

Flex代码

.errorTip

{

fontSize:12;

}

.errorTip

{

fontSize: 12;

}

2.控制检测时机

默认的情况下，Flex当我们切换组件焦点的时候检测

任意动作触发验证有两种写法。一种是在验证组件中指明触发器和触发动作。另一种是执行事件处理函数。

在验证组件中指明触发器和触发动作的语法如下所示。

Flex代码

source="{输入源id}"

property="输入源的属性"

trigger="{触发器}"

triggerEvent="触发事件">

source="{输入源id}"

property="输入源的属性"

trigger="{触发器}"

triggerEvent="触发事件">

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

Flex代码

requiredFieldError="必须输入姓名！"

trigger="{btn}"triggerEvent="click"/>

requiredFieldError="必须输入年龄！"

trigger="{btn}"triggerEvent="click"/>

requiredFieldError="必须输入姓名！"

trigger="{btn}" triggerEvent="click" />

requiredFieldError="必须输入年龄！"

trigger="{btn}" triggerEvent="click"/>

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

任意动作的触发也可采用代码触发验证方式。

其语法如下所示。

验证组件都包含一个validate方法，用以代码执行验证。

比如：

3.验证失败处理

验证失败时需要做错误的提示及处理。验证组件中提供了丰富的错误类型，只是这些错误类型的提示是英文的，用户可能需要改变提示。修改错误提示的方法是修改组件中相应的错误类型属性。例PhoneNumberValidator组件中的wrongLengthError属性表示长度错误提示。

用户可根据需要修改相应的出错信息。其语法如下所示。

例：

Flex代码

//引用ValidationResult Event类

import mx.events.ValidationResultEvent;

private function checkHandle():void     //验证处理函数

{

if(emailV.validate().type==ValidationResultEvent.VALID)

{

Alert.show("电子邮件验证成功"); //提示"验证成功"

}

}

//引用ValidationResult Event类

import mx.events.ValidationResultEvent;

private function checkHandle():void //验证处理函数

{

if(emailV.validate().type==ValidationResultEvent.VALID)

{

Alert.show("电子邮件验证成功"); //提示"验证成功"

}

}

注：

If(验证组件id.validate().type==ValidationResultEvent.VALID)

ValidationResultEvent类包含于“mx.events.*”中，是验证结果事件类。其中，INVALID值表示验证失败，VALID值表示验证成功。

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

Flex代码

requiredFieldError="必须输入姓名！"

trigger="{btn}"triggerEvent="click"/>

requiredFieldError="必须输入年龄！"

trigger="{btn}"triggerEvent="click"/>

requiredFieldError="必须选择性别！"

trigger="{btn}"triggerEvent="click"

listener="{maleRB}"/>

requiredFieldError="必须输入姓名！"

trigger="{btn}" triggerEvent="click"/>

requiredFieldError="必须输入年龄！"

trigger="{btn}" triggerEvent="click"/>

requiredFieldError="必须选择性别！"

trigger="{btn}" triggerEvent="click"

listener="{maleRB}" />

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

4.批量验证

创建一个表单

Flex代码

//创建验证控件，放在数组里

source="{roleName}"property="text"

required="true"requiredFieldError="请输入角色名"/>

//通过数组，创建组合验证

tooShortError="字符串太短了，请输入最少1个字符. "

tooLongError="字符串太长了，请输入最长10个字符. "

minLength="1"maxLength="10"/>

source="{roleEnName}"property="text"

flags="g,i"expression="^[a-z]+$"

noMatchError="请输入正确的英文字母"

required="false"/>

//代码

private function btnSubmit_click():void{

//分别检测验证是否通过，如果没有通过，则通过派发事件，主动显示错误提示

if(Validator.validateAll(roleEnNameValidators).length !=0)

roleEnName.dispatchEvent(new MouseEvent(MouseEvent.MOUSE_OVER));

else if(Validator.validateAll(roleNameValidators).length !=0)

roleName.dispatchEvent(new MouseEvent(MouseEvent.MOUSE_OVER));

else

{

var par:powerModule = this.owner as powerModule;

par.roleList.addItem({label:"大三辅导员",data:"3"});

var model:RoleModel=new RoleModel();

model.roleName="大三辅导员";

model.roleEnName="daisan";

model.roleID=par.personVo.departID+"."+model.roleEnName;

model.ysxh="010200";

model.roleDescribe="测试用的";

AddRoleResult.token=roleService.add(model);

}

}

//创建验证控件，放在数组里

source="{roleName}" property="text"

required="true" requiredFieldError="请输入角色名" />

//通过数组，创建组合验证

tooShortError="字符串太短了，请输入最少1个字符. "

tooLongError="字符串太长了，请输入最长10个字符. "

minLength="1" maxLength="10"/>

source="{roleEnName}" property="text"

flags="g,i" expression="^[a-z]+$"

noMatchError="请输入正确的英文字母"

required="false"/>

//代码

private function btnSubmit_click():void{

//分别检测验证是否通过，如果没有通过，则通过派发事件，主动显示错误提示

if(Validator.validateAll(roleEnNameValidators).length != 0)

roleEnName.dispatchEvent(new MouseEvent(MouseEvent.MOUSE_OVER));

else if(Validator.validateAll(roleNameValidators).length != 0)

roleName.dispatchEvent(new MouseEvent(MouseEvent.MOUSE_OVER));

else

{

var par:powerModule = this.owner as powerModule;

par.roleList.addItem({label:"大三辅导员",data:"3"});

var model:RoleModel=new RoleModel();

model.roleName="大三辅导员";

model.roleEnName="daisan";

model.roleID=par.personVo.departID+"."+model.roleEnName;

model.ysxh="010200";

model.roleDescribe="测试用的";

AddRoleResult.token=roleService.add(model);

}

}

附录：

1.邮件验证

Flex代码

id="emailV"

source="{txtEmail}"

property="text"

invalidCharError="非法字符"

invalidDomainError="非法域"

invalidIPDomainError="非法IP域"

missingAtSignError="缺少@符"

missingPeriodInDomainError="缺少域后缀"

missingUsernameError="缺少用户名"/>

id="emailV"

source="{txtEmail}"

property="text"

invalidCharError="非法字符"

invalidDomainError="非法域"

invalidIPDomainError="非法IP域"

missingAtSignError="缺少@符"

missingPeriodInDomainError="缺少域后缀"

missingUsernameError="缺少用户名"/>

2.字符串长度验证

Flex代码

tooShortError="字符串太短了，请输入最少4个字符. "

tooLongError="字符串太长了，请输入最长20个字符. "

minLength="4"maxLength="20"

trigger="{myButton}"triggerEvent="click"

valid="Alert.show('字符串格式正确!');"/>

tooShortError="字符串太短了，请输入最少4个字符. "

tooLongError="字符串太长了，请输入最长20个字符. "

minLength="4" maxLength="20"

trigger="{myButton}" triggerEvent="click"

valid="Alert.show('字符串格式正确!');"/>

3.日期验证

Flex代码

required="true"requiredFieldError="请输入日期"

allowedFormatChars="-"inputFormat="YYYY-MM-DD"

trigger="{btnSubmit}"triggerEvent="click"

valid="mx.controls.Alert.show('验证成功');"

invalid="mx.controls.Alert.show('验证失败');"

wrongDayError="日输入错误"

wrongMonthError="月输入错误"

wrongYearError="年输入错误"

wrongLengthError="日期长度错误"

invalidCharError="日期分隔符错误"

formatError="inputFormat 配置错误"/>

required="true" requiredFieldError="请输入日期"

allowedFormatChars="-" inputFormat="YYYY-MM-DD"

trigger="{btnSubmit}" triggerEvent="click"

valid="mx.controls.Alert.show('验证成功');"

invalid="mx.controls.Alert.show('验证失败');"

wrongDayError="日输入错误"

wrongMonthError="月输入错误"

wrongYearError="年输入错误"

wrongLengthError="日期长度错误"

invalidCharError="日期分隔符错误"

formatError="inputFormat 配置错误"/>

4.英文字母验证

Flex代码

source ="{txtInput}"property ="text"

flags ="g,i"expression ="^[a-z]+$"

valid ="handleResult(event)"invalid ="handleResult(event)"

trigger ="{btnSubmit}"triggerEvent ="click"

noMatchError ="请输入正确的英文字母"

required ="false"/>

< mx:RegExpValidator id ="regExpValidator"

source ="{txtInput}" property ="text"

flags ="g,i" expression ="^[a-z]+$"

valid ="handleResult(event)" invalid ="handleResult(event)"

trigger ="{btnSubmit}" triggerEvent ="click"

noMatchError ="请输入正确的英文字母"

required ="false" />

5.年龄验证

Flex代码

domain="int"

minValue="6"

maxValue="100"

lowerThanMinError="年龄过小！"

exceedsMaxError="年龄过大！"

integerError="年龄必须是整数！"

invalidCharError='输入了非数字字符！'

requiredFieldError="必须输入年龄！"

trigger="{btn}"triggerEvent="click"/>

domain="int"

minValue="6"

maxValue="100"

lowerThanMinError="年龄过小！"

exceedsMaxError="年龄过大！"

integerError="年龄必须是整数！"

invalidCharError='输入了非数字字符！'

requiredFieldError="必须输入年龄！"

trigger="{btn}" triggerEvent="click"/>

6.性别验证

Flex代码

requiredFieldError="必须选择性别！"

trigger="{btn}"triggerEvent="click"

listener="{maleRB}"/>

requiredFieldError="必须选择性别！"

trigger="{btn}" triggerEvent="click"

listener="{maleRB}"/>

参考文献：

1.用Validator组件检测必填项. http://blog.csdn.net/zzr173/archive/2008/09/14/2842409.aspx

2.批量检查validator. http://blog.csdn.net/supsteven/archive/2009/04/11/4062882.aspx

3.一个让validator验证时，立即出现tooltip的小方法. http://blog.csdn.net/supsteven/archive/2009/04/15/4076343.aspx

4.flex的数据验证. http://blog.csdn.net/turkeyzhou/archive/2008/11/29/3397172.aspx