3

選択ボックスを検証したいのですが、jQuery UIを使用して選択ボックスのスタイルを設定しているため、機能していません。

Jquery UIは、ディスプレイ上の実際の選択ボックスに設定されています：なし。そのため、機能しません。以下を参照してください。 html

しかし、どうすればjQuery UI selectboxプラグインで動作させることができますか？

私は誰かが実用的な解決策を持っていることを願っています。:)

4

2 に答える 2

8

これは、 が を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/

于 2012-04-05T12:15:57.850 に答える