云自无心水自闲

天平山上白云泉,云自无心水自闲。何必奔冲山下去,更添波浪向人间!
posts - 288, comments - 524, trackbacks - 0, articles - 6
  BlogJava :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理

Flex2.0中使用Validator

Posted on 2006-04-14 11:14 云自无心水自闲 阅读(1813) 评论(1)  编辑  收藏 所属分类: FlexFlex2
在Flex2.0中, Validator组件的使用方式和1.5中相比, 进行了一些改变, 不再需要定义Model, 可以在Validator属性中直接引用Form成员了.
    <mx:Form id="loginForm">
        
<mx:Text text=" {AtsModelLocator.getInstance().loginFailMessage }" width="80%" color="red"/>
    
        
<mx:FormItem label="Username: " required="true">
            
<mx:TextInput id="username" />
        
</mx:FormItem>

        
<mx:FormItem label="Password: " required="true">
            
<mx:TextInput id="password" />
        
</mx:FormItem>
    
</mx:Form>


    
<mx:ControlBar>
        
<mx:Button id="loginSubmit" label="Login" mouseUp="loginUser()"/>
    
</mx:ControlBar>
    
    
<mx:StringValidator id="userNameValidator" source="{username}" property="text"
        tooShortError
="This string is shorter than the minimum allowed length of 3. " 
        tooLongError
="This string is longer than the maximum allowed length of 20." 
        minLength
="4" maxLength="20"/>

    
<mx:StringValidator id="userPassValidator" source="{password}" property="text"
        tooShortError
="This string is shorter than the minimum allowed length of 6. " 
        tooLongError
="This string is longer than the maximum allowed length of 10." 
        minLength
="4" maxLength="20"/>

这样就定义好了两个Validator, 可以对用户名和用户密码进行校验.
但是怎么使用这两个Validator呢?

我是这样用的:
    <mx:Script>
    
<![CDATA[
        import mx.controls.Alert;
        import mx.events.ValidationResultEvent;
        import mx.validators.ValidationResult;  
            
       import com.ats.vo.LoginVO;
       import com.ats.control.LoginEvent;
       
       import mx.validators;
       
       public 
function loginUser() : void
       {
          
if ( ! modelCheckValid ) {
              modelCheckValid 
= true;
              
return;
          }
           
          
var loginVO : LoginVO = new LoginVO();
          loginVO.username 
= username.text;
          loginVO.password 
= password.text;
            
            
var event : LoginEvent = new LoginEvent( loginVO );
            dispatchEvent( event );
       }
       
       private 
var modelCheckValid : Boolean = true;
    ]]
>
    
</mx:Script>

    
<mx:Form id="loginForm">
        
<mx:Text text=" {AtsModelLocator.getInstance().loginFailMessage }" width="80%" color="red"/>
    
        
<mx:FormItem label="Username: " required="true">
            
<mx:TextInput id="username" />
        
</mx:FormItem>

        
<mx:FormItem label="Password: " required="true">
            
<mx:TextInput id="password" />
        
</mx:FormItem>
    
</mx:Form>


    
<mx:ControlBar>
        
<mx:Button id="loginSubmit" label="Login" mouseUp="loginUser()"/>
    
</mx:ControlBar>
    
    
<mx:StringValidator id="userNameValidator" source="{username}" property="text"
        tooShortError
="This string is shorter than the minimum allowed length of 3. " 
        tooLongError
="This string is longer than the maximum allowed length of 20." 
        minLength
="4" maxLength="20"
        invalid
="modelCheckValid=false"
        trigger
="{loginSubmit}"
        triggerEvent
="mouseDown"/>

    
<mx:StringValidator id="userPassValidator" source="{password}" property="text"
        tooShortError
="This string is shorter than the minimum allowed length of 6. " 
        tooLongError
="This string is longer than the maximum allowed length of 10." 
        minLength
="4" maxLength="20"
        invalid
="modelCheckValid=false"
        trigger
="{loginSubmit}"
        triggerEvent
="mouseDown"/>



为什么这么复杂地在Validator中定义trigger, triggerEvent呢?
原因是这样的: 如果不是在Validator的invalid事件中去设置modelCheckValid这个标志量.
就需要在loginUser()函数中对所有Validator进行判断, 代码会显得比较臃肿复杂.
而且如果需要考虑是否需要一次性显示出所有校验失败的错误.
代码示例:
    <mx:Script>
    
<![CDATA[
        import mx.controls.Alert;
        import mx.events.ValidationResultEvent;
        import mx.validators.ValidationResult;  
            
       import com.ats.vo.LoginVO;
       import com.ats.control.LoginEvent;
       
       import mx.validators;
       
       public 
function loginUser() : void
       {
       
          
var vrEvent : ValidateResultEvent;
          
          
var checkFailed : Boolean = false;
          
          vrEvent 
= userNameValidator.validate();
          
if ( vrEvent.results != null && vrEvent.results.length > 0 ) {
              
// 验证失败
              checkFailed = true;
          }
          
          vrEvent 
= userPassValidator.validate();
          
if ( vrEvent.results != null && vrEvent.results.length > 0 ) {
              
// 验证失败
              checkFailed = true;
          }
          
          
if ( checkFailed ) return;
           
          
var loginVO : LoginVO = new LoginVO();
          loginVO.username 
= username.text;
          loginVO.password 
= password.text;
            
            
var event : LoginEvent = new LoginEvent( loginVO );
            dispatchEvent( event );
       }
       
    ]]
>
    
</mx:Script>

    
<mx:Form id="loginForm">
        
<mx:Text text=" {AtsModelLocator.getInstance().loginFailMessage }" width="80%" color="red"/>
    
        
<mx:FormItem label="Username: " required="true">
            
<mx:TextInput id="username" />
        
</mx:FormItem>

        
<mx:FormItem label="Password: " required="true">
            
<mx:TextInput id="password" />
        
</mx:FormItem>
    
</mx:Form>


    
<mx:ControlBar>
        
<mx:Button id="loginSubmit" label="Login" mouseUp="loginUser()"/>
    
</mx:ControlBar>
    
    
<mx:StringValidator id="userNameValidator" source="{username}" property="text"
        tooShortError
="This string is shorter than the minimum allowed length of 3. " 
        tooLongError
="This string is longer than the maximum allowed length of 20." 
        minLength
="4" maxLength="20"/>

    
<mx:StringValidator id="userPassValidator" source="{password}" property="text"
        tooShortError
="This string is shorter than the minimum allowed length of 6. " 
        tooLongError
="This string is longer than the maximum allowed length of 10." 
        minLength
="4" maxLength="20"/>

这种方法也是可行的.
至于具体使用哪一个, 凭自己的喜好了.



评论

# re: Flex2.0中使用Validator  回复  更多评论   

2007-09-27 09:45 by tiangej
《目的》:
画面项目"用户id"必须是英文数字,且长度在4--20之间。
于是我计划用 mx:StringValidator(字符串验证) 和 mx:RegExpValidator(正则验证)同时作用于上述的项目上。

《结果》:
只有最后定义的验证项发挥作用。

《问题》:
是否能够对同一输入项目进行两种以上的数据校验(用Validator对象)?

只有注册用户登录后才能发表评论。


网站导航: