3

ここのドキュメントを見る: http://docs.jquery.com/Plugins/Validation/Reference#Fields_with_complex_names_.28brackets.2C_dots.29 ルールを入力配列にアタッチするための構文は次のようになります。

rules: {
"user[email]": "email",

ただし、私の場合、配列キーは数値であり、任意の値を持つことができますが、それでもルールをフィールドにアタッチしたいと思います。jQuery を使用して入力フィールドを動的に追加します (keyはグローバル変数です)。

 $('a#addfield').click(function(e)
 {
    e.preventDefault();
    var data = '<p><input type="file" name="field['+key+']"></p>';
    $('div#inputcontainer').append(data);
 });

サンプル HTML 出力:

<p><input name="field[19]" type="file"></p>
<p><input name="field[22]" type="file"></p>
<p><input name="field[25]" type="file"></p>

私は次のようにルールを定義しようとしました：

rules: 
{
   'field[]': {
         required: true,
         extension: "pdf|doc|docx"
    }
}

(この回答から取得: jquery validate add rules for an array input 編集:ルールを設定するこの提案された方法は'field[]'、検証プラグインでは機能しません。以下の回答とコメントを参照してください。)

しかし、他のファイルタイプを追加しようとしても検証エラーはありません...何か提案はありますか?

4

3 に答える 3

2

.rules("add", rules)生成された各要素に適用できます。

$(element).rules("add", { required:true, extension: "pdf|docx?" });

jQuery.validateは、フォームに設定されたルール (少なくとも v1.11 まで) を通じて、同じ名前 ( foo[]nor ) を持つ要素を検証する方法を提供します。foo[N]

動的ルールを追加する方法は他にもいくつかあります。たとえば、要素で.rules('add')単純に使用できる呼び出しなしで必要なチェックを追加するclass="required"と、検証プラグインはそれを動的に取得する必要があります。

ただし、このオプションに相当する組み込み機能はないextensionため、すべての入力にクラスを追加し、 を使用して独自のクラス ルールを作成する必要がありますaddClassRules。ただし、これにより、HTML および場合によっては CSS と少し動作が混在することになります。

将来の読者への注意: と の両方は、繰り返される名前 (例 ) では機能しませ.rules('add')んが、 OP のケースである名前がまったく同じでない場合 (例) は機能します。addClassRulesfoo[]foo[index]

まったく同じ名前の入力はこの質問のトピックから外れていると思いますが、これらについては、を使用して独自の検証メソッドを追加するかaddMethod、フォームの送信ハンドラー内に独自の検証を追加するか、この関連する回答を試す必要があります。

于 2013-03-12T14:08:20.787 に答える
1

与えられた答えは正しいと思いますが、2つのルールを組み合わせたクラスルールを作成し、入力にこのクラスを与えることも検討する価値があります。そうすれば、DOMに新しい要素を動的に追加するたびにaddMethodを呼び出す必要がありません。

$.validator.addClassRules("myinput", { required:true, extension: "pdf|docx?" });

html

<input name="field[19]" type="file" class="myinput"> 
<input name="field[22]" type="file" class="myinput"> 
<input name="field[25]" type="file" class="myinput">
于 2013-03-12T14:37:00.747 に答える
1

編集:私の回答は、コメントを読まずに質問の元のバージョンに投稿されました。これらのフィールドが動的に作成されることは不明でした。それ以外の場合は、各フィールドが作成されるたびに単純にルールを追加することをお勧めします。

var myRule = { // save some code... put the common rule into a variable
    required:true,
    extension: "pdf|docx?"
};

$('a#addfield').click(function(e) {
    e.preventDefault();
    var data = '<p><input type="file" name="field['+key+']"></p>';
    $('div#inputcontainer').append(data);
    $('[name="field['+key+']"]').rules("add", myRule); // add the rule to the new field
});

(ネストされたブラケットは、この回答に従って処理されます。)

元の答えは次のとおりです。

受け入れられた答えは、あなたをそこに導きます。

classまた、私の回答では、既存の HTML 構造に追加またはその他の変更を加える必要はありません。これはすべてjQueryです...

前半はビルトインrules('add')メソッドの使い方です。

$(element).rules("add", {
    required:true,
    extension: "pdf|docx?"
});

後半は"field[19]"、"field[20]"、"field[21]"、 などの名前を持つすべての要素にそのメソッドを適用することです。

jQuery を「で始まる」セレクターでjQuery.each()を使用するだけです。

$('[name^="field"]').each(function() {
    $(this).rules("add", {
        required:true,
        extension: "pdf|docx?"
    });
});

デモ: http://jsfiddle.net/cWABL/

于 2013-03-12T15:22:09.037 に答える