波斯码BOSSMA Information Technology

Flex的数据验证控件

发布时间:2008年6月19日 / 分类:Flex / 8,710 次浏览 / 评论

??? 一直感觉flex builder与visual studio有很多的相似之处。
?? 这篇文章介绍flex中的数据验证控件如何使用,感觉比asp.net的验证控件要好那么一点点。flex封装了常见的数据验证,如电子邮件、电话号码等。所有的验证控件都继承了mx.validators.Validator 这个类。如果你想开发一个自己的验证控件,可以继承这个类,并且重写Validator.doValidation() 这个方法,这一篇文章不会介绍这些东西。
?? 先来看一个例子:
?? 有这样一个表单,要求输入用户名和电子邮件,使用了StringValidator和EmailValidator这两个控件。
?? 代码如下:

<mx:StringValidator id="nickNameV" source="{nickName}" property="text" trigger="{btn}" triggerEvent="click" requiredFieldError="请输入用户名!" />
<mx:EmailValidator id="emailV" source="{email}" property="text"
? ? requiredFieldError="请输入E-mail!"
? ? invalidCharError="E-mail地址中有错误字符!"
? ? invalidDomainError="E-mail地址中的域名不符合规范!"
? ? invalidIPDomainError="E-mail地址中的IP格式域名不符合规范!"
? ? invalidPeriodsInDomainError="域名中的“.”错误!"
? ? missingAtSignError="E-mail地址缺少“@”符号!"
? ? missingPeriodInDomainError="域名中缺少“.”!"
? ? missingUsernameError="E-mail地址缺少用户名!"
? ? tooManyAtSignsError="E-mail地址中的“@”符号太多!"
? ? trigger="{btn}" triggerEvent="click"/>
<mx:FormItem label="姓名:" required="true" height="30" width="400">
<mx:TextInput id="nickName" width="200" backgroundColor="#F8FCF0"/></mx:FormItem>
<mx:FormItem label="电子邮件:" required="true" height="30" width="400">
<mx:TextInput id="email" width="200" backgroundColor="#F8FCF0"/></mx:FormItem>
<mx:Button id="btn" label="提 交" click="InsertGuestBook()" x="390" y="235"/>

在验证控件中source指定了要验证的控件,property指定了控件的输入属性,trigger指定了触发验证的控件,triggerEvent指定了触发验证的控件的事件。这里就介绍这几个,其它属性自己可以看看。

如果输入的信息不符合我们的要求,验证控件会返回定义的错误信息,怎么使表单不能提交呢?
我使用这种办法,不知道有没有更好的办法:

//添加验证控件数组
private var AddGBValidators:Array;

//初始化,这个我放在creationComplete中执行,也可以放在InsertGuestBook()中
private function initApp():void {
//初始化验证控件数组
AddGBValidators = [emailV,nickNameV];
}

//提交表单
public function InsertGuestBook():void{
//检查验证控件,如果有错误,就会退出程序执行,在页面上看到错误。
var errors:Array = Validator.validateAll(AddGBValidators);
?? if (errors.length != 0) {
????? return;
?? }
}

如下图:验证发现问题

OK,这篇文章到这里就结束了,验证控件有很多,欢迎大家与我交流。

本博客所有文章如无特别注明均为原创。
复制或转载请以超链接形式注明转自波斯码,原文地址《Flex的数据验证控件

关键字:

建议订阅本站,及时阅读最新文章!
【上一篇】 【下一篇】