0

フォームを検証しようとしていますが、パスワード フィールドのフィールドに値を入力しなくても、何らかの理由で常に true と検証されます。コントロールをテキストに変更すると、テキスト ボックスに何も入力しなくても検証が機能します。以下は私のコードです。ここで何が間違っているのかわかりません。

<form id="frmChangePassword" action="http://localhost/PatientAccount" method="post">
    <div class="row"><input type="password" id="txtPWD" name="txtPWD" placeholder="" style="" class="text focus" value=""></div>
    <div class="row"><input type="password" id="txtReEnterPWD" name="txtReEnterPWD" placeholder="" style="" class="text" value=""></div>
    <div class="row"><input type="Button" ID="btnChangePassword" Name="btnChangePassword" STYLE="" Class="btn-submit" VALUE="Change Password" onClick="javascript:ValidateResetPassword();"></div>
</form>

<script>
function ValidateResetPassword() {
    $("#frmChangePassword").validate({
        rules: {
            "txtPWD": { required:true },
            "txtReEnterPWD": { required:true }
        },
        messages: {
            "txtPWD": { required: "Please enter Password" },
            "txtReEnterPWD": {required: "Please re-enter password" }
        }
    });

    if ($("#frmChangePassword").valid()) {
        hashPassword();
    }
}
</script>
4

1 に答える 1

3

小さな問題がたくさんあります。

1) Validate プラグインを呼び出すために、送信ボタンにインライン JavaScript は必要ありません。プラグインは、そのsubmitHandlerコールバック関数を使用して内部的に処理します。

2) 送信ボタンは<input type="submit". 別のものにする必要がある場合は、別のコードが必要になります。

3) この.validate()関数は、DOM の準備ができたときにフォームを「初期化」するためにのみ使用する必要があります。ボタンがクリックされるたびに呼び出される別の関数内に誤って囲みました。

4)if valid条件はページのロード時に 1 回だけ呼び出され、フォームはページのロード時に常に無効であるため、hashPassword()関数は現在呼び出されません。フォームが有効なときはいつでもその関数を発生させたい場合は、submitHandler:コールバック関数の中に入れます。

$(document).ready(function() {

    $("#frmChangePassword").validate({
        rules: {
            "txtPWD": {
                required: true
            },
            "txtReEnterPWD": {
                required: true
            }
        },
        messages: {
            "txtPWD": {
                required: "Please enter Password"
            },
            "txtReEnterPWD": {
                required: "Please re-enter password"
            }
        },
        submitHandler: function (form) { 
            hashPassword();
            form.submit();
            // alert('valid form'); // for demo
            // return false; // for demo
        }
    });

});

ワーキングデモ:

http://jsfiddle.net/zgwkR/

プラグインのドキュメント:

http://docs.jquery.com/Plugins/Validation

公式サンプルフォーム:

http://jquery.bassistance.de/validate/demo/

于 2013-01-19T16:45:36.760 に答える