web-dev-qa-db-ja.com

display:noneフォーム要素を持つjqueryバリデータプラグイン

見つかったバリデータプラグイン here を使用してフォームを検証しています。

私が抱えている問題は、フォーム入力要素の周りに以下を配置すると、検証が失敗することです。

<div style="display:none;"><input type="text" name="test" /></div>

これは、入力要素に他のUIコントロールレイヤーを使用していて、それらを表示したくないためです。

インライン要素とブロック要素で機能しますが、非表示にする必要があります。とにかくこれを回避する方法はありますか?

フィードバックをありがとう

更新:

Django(つまり:{{form.select_option_element}})を使用して、主に選択オプションフィールドを検証しています

とても効果的:

<div style="display:none;">
    {{form.select_option_element}}
</div>

...機能しない

投稿直後、私はそれで解決するようです:

<div style="visibility: hidden; height: 0;">
     {{form.select_option_element}}
</div>

その後、フィールドを検証できます。

21
user1597002

jQuery Validate の1.9.0変更ログから:

  • 修正#189-:hidden要素はデフォルトで無視される

オンに戻すには、次の操作を行います。

$(document).ready(function(){    
    $.validator.setDefaults({
        ignore: []
    });
});

これがコード内で実際の検証プラグインを呼び出すになることを確認してください。

これが役に立てば幸いです!

48
dSquared

私は@dSquaredの答えが好きですが、残念ながら「無視」プロパティはページ上のすべてのフォームのバリデーターでリセットされます。場合によっては必要ありません。

私はこのように使用します:

$(document).ready(function () {

    var $form = $("#some-form");

    $form.validate().settings.ignore = []; // ! Say to validator dont ignore hidden-elements on concrete form.

    $('#button-send').click(function () {
        if ($form.valid()) { .. }
    });

    // !! apply plugin's initializers which will hide Origin elements (it can be CLEditor or Choosen plugins)
});
3
vladimir

Input属性にスタイル属性を追加してみましたか? divでラップする代わりに、以下を試してください:

<input type="text" name="test" value="" style="display: none;" />
1
rafiki_rafi

できることは2つあります。

1)この入力フィールドに対して、検証に失敗しない値を静的に設定できます。

<div style="display:none;"><input type="text" name="test" value="default" /></div>

2)検証メソッドでこの値を無効にする場合。

より詳細なコードを提供していただければ幸いです。

0
prakashpoudel

この問題を解決する別の形式は、display: noneからvisibility: hidden

例:<input type="text" name="test" value="" style="visibility: hidden;" />

0
Caike Bispo