0

フォームのフィールドが空白のときにバリデーターが成功メッセージを表示する理由を理解できません。$.post は、すべてのフィールドが検証されるまで実行されるべきではないと信じるようになりました。ここで簡単なものが欠けていますか？誰かが私の誤りを指摘できれば、私は感謝します。私が使用しているスクリプトはhttp://jqueryvalidation.org/にあります。ありがとう

jqueryコード

$(function () {

    $.validator.setDefaults ({

        errorClass: 'form_error',
        errorElement: 'div'
    });

    $("#BA_boxform").validate({
        rules: {
            BA_customer: {
                required: true
            },
            customerdept: {
                required: true
            },
            customeraddress: {
                required: true
            },
            BA_service: {
                required: true
            },
            BA_box: {
                required: true
            },
            BA_destdate: {
                required: true
            },
            BA_authorised: {
                required: true
            }
        },
        messages: {
            BA_customer: {
                required: '<br />* required: You must select a customer'
            },
            customerdept: {
                required: "<br />* required: You must select a department"
            },
            customeraddress: {
                required: "<br />* required: You must select a customer address"
            },
            BA_service: {
                required: "<br />* required: You must select a service level"
            },
            BA_box: {
                required: "<br />* required: You must enter a box number for intake"
            },
            BA_destdate: {
                required: "<br />* required: You must enter a destruction date"
            },
            BA_authorised: {
                required: "<br />* required"
            }
        },

        submitHandler: function()   {
                if ($("#BA_boxform").valid() === true)  { 
                var data = $("#BA_boxform").serialize();
                $.post('/domain/admin/requests/boxes/boxesadd.php', data, function()    {


                }, 'json');
        } else
                { 
            return; 
                }
        },
        success:  function(msg) {
                $("#BA_addbox").html("You have entered a box");
                //$("#BA_boxform").get(0).reset();
        }

    });


});
4

2 に答える 2

2

このsuccess関数は、フォーム全体が有効な場合だけでなく、正常に検証された入力ごとに呼び出されます。ドキュメントから：

指定すると、有効な要素を示すエラー ラベルが表示されます。String が指定されている場合は、クラスとしてラベルに追加されます。関数が指定されている場合は、ラベル (jQuery オブジェクトとして) と検証済みの入力 (DOM 要素として) を使用して呼び出されます。ラベルを使用して、「ok!」などのテキストを追加できます。

すべてのフィールドが正常に検証されるまで、フォームは送信されません。フォームがすべて正常なときにメッセージを表示する場合は、submitHandler関数内で実行します。

これが動作する私のバージョンです。(フィドル)

.valid()送信ハンドラーのチェックを外しました。フォームが有効でない限り送信ハンドラーが呼び出されないため、冗長です。$.post()フィドルは何も投稿できないため、電話をかける前に「ボックスに入力しました」というメッセージを移動しました。これは、私たちがそこにたどり着いたことを証明しています。

$(function () {

    $.validator.setDefaults({

        errorClass: 'form_error',
        errorElement: 'div'
    });

    $("#BA_boxform").validate({
        rules: {
            BA_customer: {
                required: true
            },
            customerdept: {
                required: true
            },
            customeraddress: {
                required: true
            },
            BA_service: {
                required: true
            },
            BA_box: {
                required: true
            },
            BA_destdate: {
                required: true
            },
            BA_authorised: {
                required: true
            }
        },
        messages: {
            BA_customer: {
                required: '<br />* required: You must select a customer'
            },
            customerdept: {
                required: "<br />* required: You must select a department"
            },
            customeraddress: {
                required: "<br />* required: You must select a customer address"
            },
            BA_service: {
                required: "<br />* required: You must select a service level"
            },
            BA_box: {
                required: "<br />* required: You must enter a box number for intake"
            },
            BA_destdate: {
                required: "<br />* required: You must enter a destruction date"
            },
            BA_authorised: {
                required: "<br />* required"
            }
        },

        submitHandler: function () {
            $("#BA_addbox").html("You have entered a box");
            var data = $("#BA_boxform").serialize();
            $.post('/domain/admin/requests/boxes/boxesadd.php', data, function () {

                $("#BA_addbox").html($("#BA_addbox").html() + "<br>You have entered a box");
            }, 'json');
        },
        success: function (msg) {
            //$("#BA_addbox").html("You have entered a box");
            //$("#BA_boxform").get(0).reset();
        }

    });


});
于 2013-07-04T18:58:04.313 に答える
1

問題は、行の引数としてフォームを渡すことになっていることだと思います:

submitHandler: function() { ... }

たぶん次のように変更します：

submitHandler:function(form) { ... }

次に、id の代わりに引数を使用してデータを整理します

于 2013-07-04T18:28:47.883 に答える