19.3.2 如何使用数据验证组件
使用数据验证组件的语法如下所示。
指明source属性和property属性表示验证组件针对某一数据组件的特定属性进行验证。例如,邮箱验证组件对某输入框的text属性进行验证。
以下代码使用组件对一个输入框中的文本进行电话号码验证。
由于验证组件都不为可视化组件,所以不能放置于可视化组件内。本程序中组件不能放置于组件中。
19.3.3 验证触发方式
验证触发方式是指用户采用何种动作触发验证。常用的触发方式有默认触发和任意动作触发。默认触发是指当焦点离开输入源时触发验证。任意动作触发是指用户可指定某一动作触发验证。前者是开发过程中最常使用到的一种方式,后者比较灵活,也比较容易理解。
1.默认触发验证
当用户把焦点离开输入源时触发默认触发验证。其语法如下所示。
默认触发方式需确定验证组件的source属性和property属性,其他属性默认。
以下代码采用默认触发验证方式。当焦点离开第一个输入框时触发验证。
width="400" height="300" horizontalAlign= "center" verticalAlign="middle" x="261" y="77">
验证组件的结果直接反映在数据组件上。本程序中若输入框组件phoneInput验证错误,结果为输入框边框颜色变红色。验证错误的提示存储于数据组件的errorString属性中。
本程序的运行效果如图19-6所示。
图19-6 默认触发验证效果
2.任意动作触发验证
用户可根据需要触发验证。例如,当按下"验证"按钮时触发验证。
任意动作触发验证有两种写法。一种是在验证组件中指明触发器和触发动作。另一种是执行事件处理函数。
在验证组件中指明触发器和触发动作的语法如下所示。
trigger属性指明触发验证的组件,也称为触发器。triggerEvent属性表示触发验证组件的方法。
以下代码当用户单击"验证"按钮时触发邮编验证。
width="352" height="202" horizontalAlign ="center" verticalAlign="middle">
本程序的运行效果如图19-7所示。
图19-7 click动作触发验证
任意动作的触发也可采用代码触发验证方式。代码触发验证的方式符合Flex 3.0的事件机制,更容易理解。其语法如下所示。
验证组件都包含一个validate方法,用以代码执行验证。
上述程序使用代码方式触发验证的代码如下所示。
width="352"height="202"horizontalAlign ="center" verticalAlign="middle">
19.3.4 验证失败处理
验证失败时需要做错误的提示及处理。验证组件中提供了丰富的错误类型,只是这些错误类型的提示是英文的,用户可能需要改变提示。修改错误提示的方法是修改组件中相应的错误类型属性。例如,PhoneNumberValidator组件中的wrongLengthError属性表示长度错误提示。
用户可根据需要修改相应的出错信息。其语法如下所示。
以下代码自定义EmailValidator组件中的错误提示。
width="352" height="202" horizontalAlign="center" verticalAlign="middle">
判断验证是否正确的语法如下所示。
If(验证组件id.validate().type==ValidationResultEvent.VALID)
ValidationResultEvent类包含于"mx.events.*"中,是验证结果事件类。其中,INVALID值表示验证失败,VALID值表示验证成功。
本程序的运行效果如图19-8所示。
使用数据验证组件的语法如下所示。
指明source属性和property属性表示验证组件针对某一数据组件的特定属性进行验证。例如,邮箱验证组件对某输入框的text属性进行验证。
以下代码使用组件对一个输入框中的文本进行电话号码验证。
由于验证组件都不为可视化组件,所以不能放置于可视化组件内。本程序中组件不能放置于组件中。
19.3.3 验证触发方式
验证触发方式是指用户采用何种动作触发验证。常用的触发方式有默认触发和任意动作触发。默认触发是指当焦点离开输入源时触发验证。任意动作触发是指用户可指定某一动作触发验证。前者是开发过程中最常使用到的一种方式,后者比较灵活,也比较容易理解。
1.默认触发验证
当用户把焦点离开输入源时触发默认触发验证。其语法如下所示。
默认触发方式需确定验证组件的source属性和property属性,其他属性默认。
以下代码采用默认触发验证方式。当焦点离开第一个输入框时触发验证。
width="400" height="300" horizontalAlign= "center" verticalAlign="middle" x="261" y="77">
验证组件的结果直接反映在数据组件上。本程序中若输入框组件phoneInput验证错误,结果为输入框边框颜色变红色。验证错误的提示存储于数据组件的errorString属性中。
本程序的运行效果如图19-6所示。
图19-6 默认触发验证效果
2.任意动作触发验证
用户可根据需要触发验证。例如,当按下"验证"按钮时触发验证。
任意动作触发验证有两种写法。一种是在验证组件中指明触发器和触发动作。另一种是执行事件处理函数。
在验证组件中指明触发器和触发动作的语法如下所示。
trigger属性指明触发验证的组件,也称为触发器。triggerEvent属性表示触发验证组件的方法。
以下代码当用户单击"验证"按钮时触发邮编验证。
width="352" height="202" horizontalAlign ="center" verticalAlign="middle">
本程序的运行效果如图19-7所示。
图19-7 click动作触发验证
任意动作的触发也可采用代码触发验证方式。代码触发验证的方式符合Flex 3.0的事件机制,更容易理解。其语法如下所示。
验证组件都包含一个validate方法,用以代码执行验证。
上述程序使用代码方式触发验证的代码如下所示。
width="352"height="202"horizontalAlign ="center" verticalAlign="middle">
19.3.4 验证失败处理
验证失败时需要做错误的提示及处理。验证组件中提供了丰富的错误类型,只是这些错误类型的提示是英文的,用户可能需要改变提示。修改错误提示的方法是修改组件中相应的错误类型属性。例如,PhoneNumberValidator组件中的wrongLengthError属性表示长度错误提示。
用户可根据需要修改相应的出错信息。其语法如下所示。
以下代码自定义EmailValidator组件中的错误提示。
width="352" height="202" horizontalAlign="center" verticalAlign="middle">
判断验证是否正确的语法如下所示。
If(验证组件id.validate().type==ValidationResultEvent.VALID)
ValidationResultEvent类包含于"mx.events.*"中,是验证结果事件类。其中,INVALID值表示验证失败,VALID值表示验证成功。
本程序的运行效果如图19-8所示。