0

1ページに2つのフォームがあります（http://www.bumblebeezflorist.com/のバスケットに製品を追加してください）。あなたはここでフィドルを見ることができます：

http://jsfiddle.net/jeepstone/S5Fnn/

Delivery Estimatorがある場合、誰かがCheckoutリンクをクリックする前に、何かが入力されたことを検証したいと思います。

私はすでにサイトにjquery検証ライブラリを持っているので、これを使用することを計画していました。これまでのところ：

if($('#cartForm').length > 0) {
    $('#proceedCheckout').on('click', function (event) {
        console.log('HSA');
        $('#changeCountry').validate({
            errorClass: 'alert-error'
        });
        event.preventDefault();
    });
}

郵便番号フィールドからタブアウトすると検証は正しく機能しますが、チェックアウトボタンをクリックしても、検証は実行されません。これどうやってするの？

どうもありがとう

4

2 に答える 2

1

あなたのコード：

if($('#cartForm').length > 0) {
    $('#proceedCheckout').on('click', function (event) {
        console.log('HSA');
        $('#changeCountry').validate({ // <-- move out of here
            errorClass: 'alert-error'
        });
        event.preventDefault();  // <-- should always be first in a function
    });
}

.validate()DOM対応のフォームでプラグインを（そのオプションとともに）初期化するために使用されることになっています。クリックするたびに再初期化するため、予期しない動作が発生します。

また、存在しない場所をターゲット#changeCountryにしていたので、両方のタグに対応するものを追加しました。idididform

2つのフォームがあり、一方のフォームの送信がもう一方の検証ステータスに依存する場合は常に、プラグインの.valid()メソッドを使用してもう一方のフォームをテストします。

次のようなものを試してください。

$(document).ready(function () {

    // call .validate() to initialize the plugin
    $('#changeCountry').validate({
        errorClass: 'alert-error'
    });

    // on click, test the form using .valid()
    $('#proceedCheckout').on('click', function (event) {
        event.preventDefault();
        if ($('#changeCountry').valid()) {
            $('#cartForm').submit(); // passes validation
        } else {
            // failed validation
        }
    });

});

デモ： http： //jsfiddle.net/B9d8A/

$('#changeCountry').validate()で検証プラグインを初期化formしid #changeCountryます。

$('#changeCountry').valid()プログラムで実際の検証テストをトリガーしtrue/false、ブール値を返します。

完全なドキュメント：

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

于 2013-02-07T17:16:48.643 に答える
-1

条件付きでクリックイベントをボタンに追加するのはなぜですか？

クリックイベントがボタンに正しく割り当てられているという問題が発生しないように、クリックイベント内でカートテストを行います。

$('#proceedCheckout').on('click', function (event) {
   console.log('HSA');
   if($('#cartForm').length > 0) {
     $('#changeCountry').validate({ errorClass: 'alert-error'  });
     event.preventDefault();
   }
});
于 2013-02-07T16:17:57.953 に答える