15.5.如何去验证多个Combo Box及Radio Button组件

15.5.1 问题
如何去为多个radio button 及combo box 组件加入验证功能, 以确保最少其中一个项目会被选取?
15.5.2 解决办法
可以使用NumberValidator 去检查radio button 组件, 再使用一个自定义的Validator 去验证combo box 组件。
15.5.3 讨论
如果要从radio button 组件群中返回一个ValidationResultEvent 事件, 我们可以使用NumberValidator 去检查RadioButtonGroup 的selectedIndex 属性是否为”-1”。如果为”-1”的话,即代表radio button 中没有任何一项被选取了。而对于combo box 组件, 则可以创建一个自定义的validator, 用来检查ComboBox 的selectedItem 属性是否也空, 而被选取的项目又是否有效。
以下有关ComboBox 中自定义的validator 的代码会比较容易理解, 并且已加入注释:
代码如下:
+展开
-ActionScript
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;
}
}
}

还有一种更方便地进行复数验证的方法, 那就是使用数组。首先, 我们要把所有需要组件中的validator 都加入到一个数组中, 然后使用public static Validator.validateAll 去存取数组中的所有validator。这种方法对于需要进行复数属性的验证时是十分有用的。假如任何一个validator 返回错误, 这些错误会被收集并在Alert 控件中显示出来:
代码如下
+展开
-XML
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxmlwidth="600height="400xmlns:cookbook="oreilly.cookbook.*creationComplete="init()">
<mx:Script>
<![CDATA[
import mx.events.ValidationResultEvent;
import mx.validators.Validator;
import mx.controls.Alert;
[Bindable]
private var validatorArr:Array;
//建立一个包含所有validator的数组, 我们将会以一个方法对其进行检查
private function init():void {
validatorArr = new Array();
//push all the validators into the same array
validatorArr.push(rbgValidator);
validatorArr.push(toggleValidator);
validatorArr.push(comboValidator);
}
//对所有validator数组中的项目进行验证。如果有任何错误的话, 则会发出一个警告。
private function validateForm():void {
// the validate all method will validate all the
Validators in an array
//passed to the validateAll method
var validatorErrorArray:Array =
Validator.validateAll(validatorArr);;
var isValidForm:Boolean = validatorErrorArray.length == 0;
if (!isValidForm) {
var err:ValidationResultEvent;
var errorMessageArray:Array = [];
for each (err in validatorErrorArray) {
errorMessageArray.push(err.message);
}
Alert.show(errorMessageArray.join("\n"),"Invalid form...", Alert.OK);
}
}

]]>
</mx:Script>
<mx:StringValidator id="rbgValidatorsource="{rbg}"
property="selectedValue"/>

<mx:NumberValidator id="toggleValidatorsource="{toggleButton}"
property="selectedIndexallowNegative="false"
negativeError="Please select a Radio Button"/>

<cookbook:ComboValidator id="comboValidatorerror="Please
Select A State
prompt="{stateCB.prompt}"
source="{stateCB}property="selectedItem"/>

<mx:Form id="form">
<mx:FormItem>
<mx:ComboBox id="stateCBdataProvider="{someDataProvider}"
prompt="Select AState"/>

</mx:FormItem>
<mx:FormItem>
<mx:RadioButtonGroup id="rbg"/>
<mx:RadioButton group="{rbg}label="firstid="first"/>
<mx:RadioButton group="{rbg}id="secondlabel="second"/>
<mx:RadioButton id="thirdlabel="thirdgroup="{rbg}"/>
</mx:FormItem>
<mx:FormItem>
<mx:ToggleButtonBar id="toggleButton">
<mx:dataProvider>
<mx:Array>
<mx:String> First Option </mx:String>
<mx:String> Second Option </mx:String>
<mx:String> Third Option </mx:String>
<mx:String> Fourth Option </mx:String>
<mx:String> Fifth Option </mx:String>
</mx:Array>
</mx:dataProvider>
</mx:ToggleButtonBar>
</mx:FormItem>
</mx:Form>
<mx:Button label="validateclick="validateForm()"/>
</mx:VBox>

加支付宝好友偷能量挖...


评论(0)网络
阅读(116)喜欢(0)flash/flex/fcs/AIR