jQuery UI选择与验证插件组合

Question

我想验证我的选择框，但因为我使用jQuery UI来设置我的选择框样式，它不起作用。

jQuery用户界面上设置显示真正的选择框：无所以这就是为什么它不能正常工作，请参阅：

但我怎么能使其与jQuery UI的选择框插件工作？

我希望有一个人有一个工作解决方案。 :)

Answer 1

这只是因为selectMenu隐藏select。默认情况下，验证不会验证隐藏的元素。您可以通过ignore选项设置为[]改变这种：

$(".valid").validate({ 
    meta: "validate", 
    ignore: [], 
    groups: { 
     checks: checkbox_names 
    }, 
    errorPlacement: function(error, element) { 
     if (element.attr("type") == "checkbox") 
      error.insertAfter(element.parent().siblings().last()); 
     else if (element.is("select")) { 
      error.insertAfter(element.next("a.ui-selectmenu")) 
     } 
     else error.insertAfter(element); 
    } 
}); 

正如你注意到，改变selectMenu不会重新验证输入。

// SELECTBOXES 
$(function() { 
    $('.dataTables_length input, select').not("select.multiple").selectmenu({ 
     style: 'dropdown', 
     transferClasses: true, 
     width: null, 
     change: function() { 
      $(".valid").validate().element(this); 
     } 
    }); 
}); 

例：http://jsfiddle.net/8YvSN/