jQuery UI与Validation Plugin结合使用

Question

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

Jquery UI设置为显示的真实选择框:无,这就是为什么它不起作用看到:

但是我怎样才能使用jQuery UI selectbox插件呢？

我希望有人能有一个有效的解决方案.:)

Answer 1

这只是因为selectMenu隐藏了这个select.默认情况下,validate不会验证隐藏的元素.您可以通过将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不会重新验证输入.你可以通过点击change事件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/