8

<select>これが動的配列である場合を検証するにはどうすればよいですか？このような：

<select class="escolhaVidro id_material" name="id_material[]" id="id_material">

明確にするために：これ<select>はPHPによって動的にアセンブルされているため、インデックスが何であるかわからないため、この方法は不可能です。

$(this).validate({
    rules: {
        "id_material[index]" : {
            required : true
        }
    }
});

そして奇妙なことに、このプラグインは機能しません：

$(this).validate({
    rules: {
        id_material : {
            required : true
        }
    }
});

class requiredでもCSSを使おうとしまし<select>たが、ダメです。

4

2 に答える 2

11

OPの引用：「そして奇妙なことに、このプラグインは機能しません：
$(this).validate({ ... });」

それは奇妙ではありません。あなたは本当に何もターゲットにしていないので、それは機能していません。意味を持つための文脈や範囲はありませ$(this)ん。

<form>要素を適切にターゲットにする必要があります。

たとえば、id... 

$('#myform').validate({ ... });

...または検証したい実際を対象とする他の有効なjQueryセレクターによって。<form></form>

select状況に簡単に適応できる要素を検証する方法の一般的な例を次に示します。

http://jsfiddle.net/Gy24q/

重要、最初、または要素のデフォルトoptionに含まれている必要があります。含まれていない場合、ルールは失敗します。何らかの理由で、この最初のをに等しく設定できない場合は、この回答のカスタムメソッドの回避策とjsFiddleを参照してください。selectvalue=""requiredoptionvalue""

HTML：

<form id="myform">
    <select name="id_material[]">
        <option value="">please choose...</option>
        <option>option 1</option>
        <option>option 2</option>
        <option>option 3</option>
    </select>
    ....
</form>

nameには角かっこが含まれているため[]、フィールド名も引用符で囲む必要があります。

jQuery：

$(document).ready(function () {

    $('#myform').validate({ // initialize plugin within DOM ready
        // other options,
        rules: {
            'id_material[]': {
                required: true
            }
        },
    });

});

上記の答えは、あなたが要素のを知っていることを前提としていnameますselect。ただし、がわからないname場合は、いくつかのオプションがあります...

1）要素 class="required"の内部で 使用します。select

<select class="escolhaVidro id_material required" name="id_material[]" id="id_material">

デモ： http： //jsfiddle.net/Gy24q/4/

2）ルールがより複雑な場合は、メソッドを使用して既存の割り当てrulesに基づいて 複合を追加できます。classrules('add')

このルールを必要とする要素 .each()が複数ある場合は、jQueryを使用してください...select

// must be called after validate()
$('select.id_material').each(function () {
    $(this).rules('add', {
        required: true
    });
});

デモ： http： //jsfiddle.net/Gy24q/10/

それ以外の場合、これはルールを1つの select要素にのみ適用しclass id_materialます... 

$('select.id_material').rules('add', {
    required: true
});

編集：

コメントでOPを引用：

関数内で次の検証が実行されます。 $('#formOrcamento').live('submit', function() {...});次に 、以下$(this).validate({...});を参照します。$('#formOrcamento').validate ({...});

と同じ：

$('#formOrcamento').live('submit', function() {
    $(this).validate({ ... });
});

はい、これがまさにそれが壊れている理由です。

.validate()プラグインを初期化する準備ができているDOMで一度だけ呼び出されます。ハンドラー内に配置することは想定されていません。Validateプラグインには、フォームの送信ボタンをキャプチャする独自の組み込みイベントハンドラーがすでにあります。submit

上記の私の動作中のjsFiddleデモに従ってコードをセットアップします。

編集2：

コメントでOPを引用：

私が使用jquery-uiしているので、これにより次の選択肢が追加されます style='display: none'。Firebugを介して削除するdisplay: noneと、select検証が発生し、ラベルエラーが正しく表示されます。何が起こっているのでしょうか？

Validateプラグインは、デフォルトで非表示の要素を無視します。ignore: []次の項目に追加して、このオプションをオフにする必要がありますvalidate()。

$(document).ready(function () {

    $('#myform').validate({
        ignore: [], // to allow validation of hidden elements
        // other options,
    });

});

詳細については、この回答を参照してください。

于 2013-02-18T19:03:48.480 に答える
-1

空の角かっこを使用し、角かっこを含む名前が引用符で囲まれていることを確認してください（ドキュメントを参照）。

$(this).validate({
    rules: {
        "id_material[]" : {
            required : true
        }
    }
});
于 2016-06-28T13:12:14.287 に答える