上次说到了简单的表单验证,可以配置错误信息,点击按钮可以进行所有表单验证,那么如果验证都通过,怎样执行提交任务呢?一般都会这么处理,下面这个是button点击事件处理方法
function vaidateForm():void{
var all:Array=Validator.validateAll([numVD,emailVD,comboValidator]);
if(all.length==0){
Alert.show("验证成功");
//这里可以发送请求进行表单提交任务
}
}
关于错误信息提示方面,有人说到字体太小了不好看,那么针对这个问题肯定是样式没有配好,就如同提示框的字体太小一样都可以进行style设置的
现附上图
类似于这样的效果,配置如下
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";
.errorTip
{
fontSize:16;
}
mx|Alert{
fontSize:16;
}
</fx:Style>
接下来就说下comboBox的验证了,这个在普通验证里面是找不到的必须自己手写
ComboValidator.as
package oreilly.cookbook
{
import mx.validators.ValidationResult;
import mx.validators.Validator;
public class ComboValidator extends Validator
{
// 如果ComboBox中没有项目被选中, 则返回这个错误信息
public var error:String;
//如果开发者把一个自定义的项目推进ComboBox的数组中(这种情况我见过不少)
//我们就会把这个项跟已选取的项进行对比。
public var prompt:String;
public function ComboValidator() {
super();
}
//在这里我们进行两个检查:
//1. comboBox中有没有项目被选中
//2. 开发者有没有为comboBox加入自定义的项目
//任何一个条件为ture的话, 则返回一个错误
override protected function doValidation(value:Object):Array
{
var results:Array = [];
if(value as String == prompt || value == null) {
var res:ValidationResult = new ValidationResult(true, "", "", error);
results.push(res);
}
return results;
}
}
}
具体使用代码,使用之前先配下Application的命名空间
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:cookbook="oreilly.cookbook.*"
creationComplete="init()"
>
看到那个cookbook的没有,就是配上那个,orelilly.cookbook是as文件的包名
<fx:Declarations>
<cookbook:ComboValidator prompt="myCombox" id="comboValidator" error="请选择一项" source="{myCombox}" property="selectedItem"/>
</fx:Declarations>
- 大小: 3.8 KB
- 大小: 2.7 KB
分享到:
相关推荐
在Flex开发中,表单数据合法性验证是至关重要的一步,它确保用户输入的数据符合应用程序的预期格式和规则,...通过理解上述知识点,我们可以有效地构建健壮的Flex表单应用,提升用户体验并减少因数据问题引发的错误。
Flex动态表单源码解析与应用 Flex是一种用于构建富互联网应用程序(RIA)的技术,它基于ActionScript编程语言和Flash Player运行时环境。在Flex中,动态表单是一种强大的工具,能够根据用户需求或服务器反馈自动...
它们通常与表单控件如TextInput、ComboBox等配合使用,以确保用户提交的信息有效且正确。在Flex中,验证组件主要分为以下几类: 1. **BasicValidators**: 这些是最基础的验证器,例如RequiredValidator(验证非空...
Flex表单校验组件是基于Adobe Flex开发的一款强大的前端验证工具,它专为构建具有高效数据验证功能的用户界面而设计。在Web应用程序中,表单校验是必不可少的,因为它确保用户输入的数据符合预定义的规则,从而提高...
Flex中的`Form`组件用于创建数据输入表单,它能够自动布局和调整其子控件的位置,以适应不同的屏幕尺寸。`Form`组件支持多种数据绑定技术,使得数据收集和验证过程变得更加简单和高效。 #### Flex内建的UI控件 ...
- **表单组件**:Flex提供了丰富的表单组件,如TextField、ComboBox等,方便用户输入数据。 - **验证用户输入**:通过ActionScript 3.0编写验证逻辑,确保用户输入的数据符合预期格式和范围。 - **数据绑定**:利用...
通过以上对《Flex 3 组件实例与应用》一书中提到的各类组件的介绍,我们可以看出Flex 3提供的组件不仅涵盖了基本的UI需求,还包括了高级的交互、数据展示和验证等功能。这使得开发者能够在构建复杂的应用程序时更加...
### Flex UI组件使用全集详解 #### 概述 本文档是基于阿树对Adobe Flex UI组件库的全面整理,并结合Adobe主页上提供的各种组件代码示例进行深度解析。Flex是一种用于构建高度交互式的Web应用的框架,尤其适用于创建...
Validators用于验证输入数据的有效性,包括信用卡验证、货币验证、日期验证、电子邮件验证、数值验证、电话号码验证、正则表达式验证和社会安全号验证。 #### Formatters Formatters用于格式化显示数据,包括货币...
### Flex4.5学习笔记知识点总结 #### 一、Flex基础——布局 **知识点1:Flex布局** - **垂直布局** (`s:VerticalLayout`): 控件垂直排列。 - **水平布局** (`s:HorizontalLayout`): 控件水平排列。 - **平铺布局**...
- 介绍如何实现表单数据的有效性验证。 #### 十八、FormPanel布局与初始化 1. **布局概述** - 解释布局在ExtJs中的重要性。 2. **分割布局** - 展示如何使用Flex布局和其他布局策略来组织FormPanel内部元素。 3....