mx.validators包的使用实例之二-用Validator检测数字、字符串、Email、电话号码等

  • 本站文章除注明转载外,均为本站原创或者翻译。
  • 本站文章欢迎各种形式的转载,但请18岁以上的转载者注明文章出处,尊重我的劳动,也尊重你的智商;
  • 本站部分原创和翻译文章提供markdown格式源码,欢迎使用文章源码进行转载;
  • 本博客采用 WPCMD 维护;
  • 本文标题:mx.validators包的使用实例之二-用Validator检测数字、字符串、Email、电话号码等
  • 本文链接:http://zengrong.net/post/443.htm

在上例“用Validator检测必填项”中,我记录了Validator最简单的用法。但mx.validators包中的类并非只有Validator一个,他们可以实现信用卡号码格式检测(mx.validators.CreditCardValidator)、货币格式检测(mx.validators.CurrencyValidator)、E-mail格式检测(mx.validators.EmailValidator)等等功能,所有的检测器列表可以看这里。这些类都是Validator的子类。

先看效果。下面的范例演示了StringValidator、NumberValidator和EmailValidator的用法。由于这三个类都继承自Validator,因此都拥有requiredFieldError属性,用于自定义没有值的时候的错误信息。但是这三个类拥有更多的错误信息。要检测的值越复杂,需要定义的错误信息就越多,例如EmailValidator,本例中共定义了9个错误信息。

如果不定义错误信息,Flex会显示默认的英文错误信息,这显然也不是我们所需要的。如果想偷懒的话,可以定义几个最可能出现的错误,例如本例的NumberValidator,就没有定义所有的错误信息。

顺便还要说一句的是,NumberValidator可以指定要检测的数字是整数还是实数,这需要用domain属性来指定。同时,它还可以指定千分位分隔符。



这个效果的源码如下:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" fontSize="12" width="300" height="200">
    <mx:Style>
        <![CDATA[
        .errorTip
        {
            fontSize: 12;
        }
        ]]>
    </mx:Style>
    <mx:StringValidator id="nameV" source="{nameTI}" property="text"
        minLength="2"
        maxLength="5" 
        requiredFieldError="必须输入姓名!"
        tooShortError="姓名过短!"
        tooLongError="姓名过长!"
        trigger="{btn}" triggerEvent="click"/>
    <mx:NumberValidator id="ageV" source="{ageTI}" property="text"
        domain="int"
        minValue="6"
        maxValue="100"
        lowerThanMinError="年龄过小!"
        exceedsMaxError="年龄过大!" 
        integerError="年龄必须是整数!"
        invalidCharError='输入了非数字字符!'
        requiredFieldError="必须输入年龄!"
        trigger="{btn}" triggerEvent="click"/>
    <mx:Validator id="sexV" source="{sexRBG}" property="selectedValue" 
        requiredFieldError="必须选择性别!"
        trigger="{btn}" triggerEvent="click"
        listener="{maleRB}"/>
    <mx:EmailValidator id="emailV" source="{emailTI}" 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="姓名:" width="200">
        <mx:TextInput id="nameTI"/>
    </mx:FormItem>
    <mx:FormItem label="年龄:" width="200">
        <mx:TextInput id="ageTI"/>
    </mx:FormItem>
    <mx:FormItem label="性别:" direction="horizontal" width="200">
        <mx:RadioButtonGroup id="sexRBG"/>
        <mx:RadioButton id="maleRB" groupName="sexRBG" label="男" value="1"/>
        <mx:RadioButton id="femaleRB" groupName="sexRBG" label="女" value="0"/>
    </mx:FormItem>
    <mx:FormItem label="E-mail:" width="200">
        <mx:TextInput id="emailTI"/>
    </mx:FormItem>
    <mx:Button id="btn" label="提交" />
</mx:Application>

写本篇标题时,本来想写写PhoneNumberValidator,但是写到这里觉得PhoneNumberValidator还是太简单了,不必再费口舌。只是本篇不免有些挂挂羊头卖狗肉之嫌了。

:em20:

下载源码:

  mx.validators包的使用实例所有范例源码 (4.2 KiB, 1,732 hits)