上次说到了简单的表单验证,可以配置错误信息,点击按钮可以进行所有表单验证,那么如果验证都通过,怎样执行提交任务呢?一般都会这么处理,下面这个是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>