2013-04-18 52 views
1

的jQuery:1.9.1 jQuery的验证:1.11.1jQuery的验证动态更新的规则不工作

我呈现给用户的用户个人资料页面。当用户更改特殊字段(密码或新密码)时,我想要使某些输入字段为REQUIRED和VALIDATED。但是,这些规则只有一半是可行的,并且表格可以发布。 如果我强制规则(如'全名'和'显示名'),那么他们总是工作。 我可以不动态更新验证规则吗? 我在做什么错?

<script type="text/javascript"> 
$(document).ready(
    function() 
    { 
     function updateRules() 
     { 
      var mLen = $('#passwordnew').val().length; 
      if (mLen > 0) 
      { 
       $('#passwordold').rules('add', {required: true, minlength: 6}); 
       $('#passwordold').attr('required', 'true'); 
       $('#passwordnew').rules('add', {required: true, notEqual: '#passwordold'}); 
       $('#passwordnew').attr('required', 'true'); 
       $('#passwordconf').rules('add', {required: true, equalTo: '#passwordnew'}); 
       $('#passwordconf').attr('required', 'true'); 
      } else { 
       $('#passwordold').rules('remove'); 
       $('#passwordold').attr('required', 'false'); 
       $('#passwordnew').rules('remove'); 
       $('#passwordnew').attr('required', 'false'); 
       $('#passwordconf').rules('remove'); 
       $('#passwordconf').attr('required', 'false'); 
      } 
     } 

     // Change 
     $('#passwordold').change(updateRules); 
     $('#passwordnew').change(updateRules); 

     // Popover 
     $('#profile :input').hover(
      function() 
      { 
       $(this).popover('show') 
      }, 
      function() 
      { 
       $(this).popover('hide') 
      } 
     ); 

     // Validation 
     $('#profile').validate(
      { 
       rules: 
        { 
         displayname: {required: false, minlength: 2}, 
         emailnew: {required: false, email: true}, 
         fullname: {required: true, minlength: 5}, 
        }, 
       messages: 
        { 
         displayname: 
          { 
           minlength: "{{ Lang::line('user.profile.displayname.validate.minlength') -> get() }}", 
          }, 
         emailnew: 
          { 
           email: "{{ Lang::line('user.profile.emailnew.validate.email') -> get() }}" 
          }, 
         fullname: 
          { 
           required: "{{ Lang::line('user.profile.fullname.validate.required') -> get() }}", 
           minlength: "{{ Lang::line('user.profile.fullname.validate.minlength') -> get() }}", 
          }, 
         passwordold: 
          { 
           required: "{{ Lang::line('user.profile.passwordold.validate.required') -> get() }}", 
           minlength: "{{ Lang::line('user.profile.passwordold.validate.minlength') -> get() }}", 
          }, 
         passwordnew: 
          { 
           required: "{{ Lang::line('user.profile.passwordnew.validate.required') -> get() }}", 
           minlength: "{{ Lang::line('user.profile.passwordnew.validate.minlength') -> get() }}", 
           notEqual: "{{ Lang::line('user.profile.passwordnew.validate.notequal') -> get() }}", 
          }, 
         passwordconf: 
          { 
           required: "{{ Lang::line('user.profile.passwordconf.validate.required') -> get() }}", 
           equalTo: "{{ Lang::line('user.profile.passwordconf.validate.equalto') -> get() }}" 
          } 
        }, 
       errorClass: "help-inline", 
       errorElement: "span", 
       highlight: function(element, errorClass, validClass) 
       { 
        $(element).parents('.control-group').addClass('error'); 
       }, 
       unhighlight: function(element, errorClass, validClass) 
       { 
        $(element).parents('.control-group').removeClass('error'); 
        $(element).parents('.control-group').addClass('success'); 
       } 
      } 
     ); 
    } 
); 
</script> 

回答

0

.validate()是插件,这种情况应该只是得到所谓一次在DOM准备好初始化

$(document).ready(function() { 

     // Validation INITIALIZATION 
     $('#profile').validate({ 
      // your options and rules 
     }); 

     function updateRules() { 
      // your code 
     } 

     // Change 
     $('#passwordold').change(updateRules); 
     $('#passwordnew').change(updateRules); 

     // Popover 
     $('#profile :input').hover(
      function() { 
       $(this).popover('show') 
      }, 
      function() { 
       $(this).popover('hide') 
      } 
     ); 

});