使用validate插件的Jquery bootstrap select2插件问题

在我的bootstrap项目中，我正在尝试使用插件select2，但我意识到如果你使用这个插件不再能够使用validate插件validation我的表单中的选择字段。 我会避免使用商业插件bootstrapvalidation器..

 
 
 
 
 Foo   1 2  
 
 
 
 Bar   1 2  
 
 
 VALIDATE 
 
 
  

JS

 /* select 2 plugin */ $('select#foo').select2(); /* Validation */ $("#test_form").validate({ rules: { foo: { required: true }, bar: { required: true } }, errorPlacement: function (error, element) { $(element).addClass('err'); }, success: function (label, element) { $(element).removeClass('err'); }, submitHandler: function(form) { alert("validation ok"); } }); 

在您看来，我该如何解决这个问题？ 谢谢

我的演示

Answer 1

好。 这对我有用

 /* select 2 plugin */ $('select#foo').select2(); /* Validation */ $("#test_form").validate({ ignore: 'input[type=hidden]', rules: { foo: { required: true }, bar: { required: true } }, errorPlacement: function (error, element) { $(element).parent().addClass('has-error'); }, success: function (label, element) { $(element).parent().removeClass('has-error'); }, submitHandler: function(form) { alert("validation ok"); } }); 

我添加了一个“ignore：’input [type = hidden]’，”选项，因为Select2脚本为原始输入添加了一个隐藏选项，而Jquery Validator似乎忽略了它。 然后我将错误类从元素上的“错误”更改为父元素上的“has-error”（具有表单组类的div）