Flex 自定义 Validator 验证开始时间早于结束时间

flex 自定义验证器(Validator)，先看下示例(有点大，500多K，请耐心等待加载...)

 

代码如下：

ValidatorDate.as 

View Code 
  1 package utils
  2 {
  3     import mx.controls.DateField;
  4     import mx.validators.ValidationResult;
  5     import mx.validators.Validator;
  6     
  7     /**
  8      * 用于验证起始时间必须小于结束时间。<br>
  9      * 使用时必须指定 startDateField 与 endDateField，可选属性 errorMessage。<br>
 10      * 注意：由于涉及到两个控件，所以对于 required 判断是同时的(必须两个时间同时不为空)，可自定义 requiredFieldError 使它看上去"正确"。
 11      */
 12     public class ValidatorDate extends Validator
 13     {
 14         public function ValidatorDate()
 15         {
 16             super();
 17         }
 18         
 19         private var _startDateField:DateField;
 20 
 21         public function get startDateField():DateField
 22         {
 23             return _startDateField;
 24         }
 25 
 26         public function set startDateField(value:DateField):void
 27         {
 28             removeListenerHandler();
 29             
 30             _startDateField = value;
 31             
 32             addListenerHandler();
 33         }
 34 
 35         private var _endDateField:DateField;
 36 
 37         public function get endDateField():DateField
 38         {
 39             return _endDateField;
 40         }
 41 
 42         public function set endDateField(value:DateField):void
 43         {
 44             removeListenerHandler();
 45             
 46             _endDateField = value;
 47             
 48             addListenerHandler();
 49         }
 50         
 51         private var _errorMessage:String = "起始时间不能晚于结束时间";
 52 
 53         public function get errorMessage():String
 54         {
 55             return _errorMessage;
 56         }
 57 
 58         public function set errorMessage(value:String):void
 59         {
 60             _errorMessage = value;
 61         }
 62         
 63         
 64         override protected function get actualListeners():Array
 65         {
 66             return [_startDateField, _endDateField];
 67         }
 68         
 69         override protected function doValidation(value:Object):Array
 70         {
 71             var results:Array = super.doValidation(value);
 72             
 73             if (results.length > 0 || ((value == null) && !required))
 74             {
 75                 return results;
 76             }
 77             else
 78             {
 79                 var start:Date = value.startDate;
 80                 var end:Date = value.endDate;
 81                 if(start.time > end.time)
 82                 {
 83                     var vr:ValidationResult = new ValidationResult(true, "", "startIsAfterEnd", errorMessage);
 84                     results.push(vr);
 85                 }
 86             }
 87             
 88             return results;
 89         }
 90         
 91         override protected function getValueFromSource():Object
 92         {
 93             var value:Object = {};
 94             
 95             if(_startDateField && _endDateField && _startDateField.selectedDate && _endDateField.selectedDate)
 96             {
 97                 value.startDate = _startDateField.selectedDate;
 98                 value.endDate = _endDateField.selectedDate;
 99                 
100                 return value;
101             }
102             else 
103             {
104                 return null;
105             }
106         }
107         
108         
109     }
110 }

 

示例程序：ValidateSample.mxml 

View Code 
 1 <?xml version="1.0" encoding="utf-8"?>
 2 <s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
 3          xmlns:s="library://ns.adobe.com/flex/spark" 
 4          xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300" xmlns:utils="utils.*">
 5     <fx:Declarations>
 6         <!-- 将非可视元素（例如服务、值对象）放在此处 -->
 7         <utils:ValidatorDate id="vd" startDateField="{startDateField}" endDateField="{endDateField}" 
 8                              trigger="{submitButton}" triggerEvent="click"
 9                              requiredFieldError="开始日期与结束日期都不能为空"
10                              errorMessage="开始日期不能晚于结束日期"/>
11     </fx:Declarations>
12     
13     <s:Form width="100%" height="100%">
14         <s:FormHeading label="验证操作示例"/>
15         <s:FormItem label="开始日期">
16             <!--这里 formatString 是必须设置的属性，否则 selectedDate 始终为null -->
17             <mx:DateField id="startDateField" formatString="YYYY-MM-DD"/>
18         </s:FormItem>
19         <s:FormItem label="结束日期">
20             <mx:DateField id="endDateField" formatString="YYYY-MM-DD"/>
21         </s:FormItem>
22         <s:FormItem>
23             <s:Button id="submitButton" label="提交" click="trace('start date:', startDateField.selectedDate);"/>
24         </s:FormItem>
25     </s:Form>
26 </s:Group>

 

 

posted on 2012-05-07 15:28  lipbb  阅读(331)  评论(0)  编辑  收藏  举报

导航