3

フォーム フィールドの検証に jQuery Validation プラグインを使用しています。アイデアは、フォーム送信のいずれかのフィールドが有効なパスワード フィールドではなく、エラー メッセージがリセットされた場合、他のフィールドはそのままであるということです。パスワード フィールドをリセットする方法はありますが、エラー メッセージを削除できません。

コードはこちら: http://jsfiddle.net/2Z9jp/

すべてのフィールドに無効な値を入力して送信すると、パスワード入力フィールドは空になりますが、エラーは残ります。この場合、パスワード フィールドのエラー メッセージを削除する必要があります。

ハイライトが無効なハンドラーの後に発生し、それがこの問題を引き起こしているようです。

コードは次のとおりです。

<form id="registerForm" class="regForms" method="post" action="/">

        <span>username: </span><input type="text" id="username" name="username" /><br />
        <span class="passwordHolder">
            <span>password: </span><input type="password" id="password1" name="password1" /><br />
        </span>
        <span class="passwordHolder">
            <span>confirm password: </span><input type="password" id="password2" name="password2" /><br />
        </span>

        <input type="submit" />
    </div>
</form>



$("#registerForm").validate({
    rules: {
        username: {
            required: true,
            minlength: 6
        },
        password1: {
            required: true,
            minlength: 6,
            maxlength: 256
        },
        password2: {
            required: true,
            equalTo: "#password1",
            minlength: 6,
            maxlength: 256
        }
    },

    messages: {
        username: {
            required: "required",
            minlength: "should be 6 or longer"
        },
        password1: {
            required: "required",
            minlength: "should be 6 or longer"
        },
        password2: {
            required: "required",
            minlength: "should be 6 or longer",
            equalTo: "should be the same as password"
        }
    },

    invalidHandler: function(form, validator) {
        $(':password').val('');
        $('.passwordHolder label.error').hide();
    }

});
4

3 に答える 3

0

問題は、呼び出しlabel.error後に追加されることです。invalidHandler

迅速な回避策は setTimeout を使用することです

setTimeout(function() {
            $('.passwordHolder label.error').hide();
          },100);
于 2012-12-18T07:33:57.270 に答える
0

ハイライトがinvalidHandlerの後に表示されるというあなたの提案は絶対に正しいと思います。errorPlacement メソッドを使用する必要があると思います。ドキュメントは次の場所にあります。

http://docs.jquery.com/Plugins/Validation/validate#toptions

タイプ password の要素をチェックし、その場合はエラーの配置を省略できます。

追加のコード:

$("#myform").validate({
  errorPlacement: function(error, element) {
        if(!element.is(':password'))
              element.after(error);
   },
   debug:true
 })
于 2012-12-17T22:51:04.607 に答える
0

フォームの送信中に、次のように確認できます。

$("#registerForm").submit(function(){
    if ($("#password1").valid() == true ) {
       alert('Ok');
    }
});
于 2012-12-18T07:52:34.777 に答える