0

#formNewHouse1、#formNewHouse2、.. などの名前パターンを持つ ID を持つ jQuery プラグインでフォームを検証するにはどうすればよいですか?

このコードは、単一タイプ (通常) の形式で動作しています。

$("#formNewHouse").validate({
    rules: {
        formNewHouseName: {
            required: true
        },
        formNewHouseAddress: {
            required: true
        }
    },
    messages: {
        formNewHouseName: {
            required: "Please type a name"
        },
        formNewHouseAddress: {
            required: "Please type an address"
        }
    }
});

X = 2,3,6,18,19,... (DB からの ID) のようなものが必要です。どうすればこれを達成できますか?

$("#formNewHouseX").validate({
    rules: {
        formNewHouseNameX: {
            required: true
        },
        formNewHouseAddressX: {
            required: true
        }
    },
    messages: {
        formNewHouseNameX: {
            required: "Please type a name"
        },
        formNewHouseAddressX: {
            required: "Please type an address"
        }
    }
});

前もって感謝します。

4

4 に答える 4

4

また、この質問と同様に、有効な回答があります：

ワイルドカードを使用してターゲット フィールドを検索する jQuery Validate セット ルール

他の人に欠けているものと一緒に答えがあります...動作するデモ：

jQuery の.each()メソッドを使用.validate()して、一致するすべてのフォームを初期化します。

次に、組み込みrules()メソッドを使用してルールを追加し、class. ドキュメントを参照してください。

HTML:

<form id="formNewHouse1">
    <input type="text" class="myclass" name="formNewHouseName" />
    <input type="text" class="myclass" name="formNewHouseAddress" />
</form>

<form id="formNewHouse2">
    <input type="text" class="myclass" name="formNewHouseName2" />
    <input type="text" class="myclass" name="formNewHouseAddress2" />
</form>

jQuery:

var myoptions = {
    // contains options for all forms
};

$("form[id^=formNewHouse]").each(function() {
    $(this).validate(myoptions);
});

// the following method must come AFTER .validate()
$('form').find('.myclass').each(function() {
    $(this).rules('add', {
        required: true,
        digits: true, // just another example rule
        messages: {
            required: "Required input",
            digits: "Please only enter digits"
        }
    });
});

jsFiddle デモ

于 2013-01-15T19:10:03.727 に答える
2

まず、1 回の呼び出しですべてのフォームを検証します。最後に確認したところ、jQuery Validate はコレクションの検証を正しく処理しなかった.eachため、フォームごとに新しいバリデーターを作成するために (または同様の方法で) 使用する必要があります。

$("form[id^=formNewHouse]").each(function() { $(this).validate() });

次に、フィールドにクラスを追加して、クラスをまとめて選択し、ルールを適用できるようにします。

$('.newHouseName').rules('add', {required: true, messages: {required: 'Please type a name'}});
$('.newHouseAddress').rules('add', {required: true, messages: {required: 'Please type an address'}});
于 2013-01-14T21:04:25.653 に答える
0

問題は、ページをどのように構成したかということだと思います。私はあなたが次のようなものを持っていると思います

<form id="formNewHouse1">
    <input type="text" name="newHouseName1" />
    <input type="text" name="newHouseAddress1" />
</form>

<form id="formNewHouse2">
    <input type="text" name="newHouseName2" />
    <input type="text" name="newHouseAddress2" />
</form>

これは、検証のルールを与えるために個々の入力を呼び出す際に発生する問題につながります。しかし、HTMLを再構築すれば、すべてをうまくクリーンアップできると思います。フォームに一意の名前/IDを付けることができますが、入力には同じ名前を付けたままにします。

<form id="formNewHouse1" class="formNewHouse">
    <input type="text" name="newHouseName" />
    <input type="text" name="newHouseAddress" />
</form>

<form id="formNewHouse2"  class="formNewHouse">
    <input type="text" name="newHouseName" />
    <input type="text" name="newHouseAddress" />
</form>

次に、投稿の場合と同じように検証を呼び出すことができますが、代わりにクラスを使用します。

$(".formNewHouse").validate({
    rules: {
        formNewHouseName: {
            required: true
        },
        formNewHouseAddress: {
            required: true
        }
    },
    messages: {
        formNewHouseName: {
            required: "Please type a name"
        },
        formNewHouseAddress: {
            required: "Please type an address"
        }
    }
});

ただし、入力名を動的に生成している場合は、それらをすべて個別に実行する必要がある位置にいることになります。だから私はそれがあなたがしていることではないことを願っています。

于 2013-01-14T21:12:01.907 に答える
0

クラスを使用する方が良いでしょうが、IDを使用する必要がある場合は、このようなものを使用できます

$("form[id^='formNewHouse']").validate({
    //...
});

これにより、「formNewHouse」で始まる ID を持つすべてのフォーム要素が選択されます

于 2013-01-14T21:08:43.933 に答える