1

送信ボタンが選択されたときにフォーム検証を実行しましたが、デフォルトの送信機能を実行したくありません。代わりに、サーバー側からデータを投稿するとともに、フォームにデータを保存するために ajax ポスト コードを実行したいと考えています。

デフォルトの送信をキャンセルして ajax コードを追加する場所を見つけるのに苦労しています。

ここに私が持っている検証コードがあります

    $("#formEnroll").validate({
    errorElement:"p",
    submitHandler: function(form) {
            var phoneNumber = form.day_phone.value;             
            var phoneParts  = phoneNumber.split("-");
            form.dayArea.value = phoneParts[0];
            form.dayPrefix.value = phoneParts[1];
            form.daySuffix.value = phoneParts[2];               
            form.submit();
    }

});

そして、これがデフォルトの送信の代わりに実行したいajaxコードです

$.ajax({
    type: "POST",
    url: "/php/localProxy.php",
    data: $('#formEnroll').serialize(),
    success: function (response) {
            document.location = 'http://www.xxxx.com/thank-you';

    },
    error: function () {
            alert('There was a problem!');  // handle error
    }
        });
4

3 に答える 3

2

form.submit()の代わりにajax関数を呼び出すことができます。form.submit(); デフォルトの送信を使用してコードを送信します。

  $('#formEnroll').on('submit', function(e){
        e.preventDefault(); 

        $(this).validate({
            errorElement:"p",
            submitHandler: function(form) {
                var phoneNumber = form.day_phone.value;             
                var phoneParts  = phoneNumber.split("-");
                form.dayArea.value = phoneParts[0];
                form.dayPrefix.value = phoneParts[1];
                form.daySuffix.value = phoneParts[2];               
                submitform();
            }
        });
    })

    function submitform(){
    $.ajax({
        type: "POST",
        url: "/php/localProxy.php",
        data: $('#formEnroll').serialize(),
        success: function (response) {
                document.location = 'http://www.xxxx.com/thank-you';

        },
        error: function () {
                alert('There was a problem!');  // handle error
        }
    });

    }
于 2012-09-12T04:48:16.363 に答える
0

送信ボタンをクリックしてjqueryのクリックイベントを使用してajaxでデータを送信できます。その機能は、return falseajaxを使用してデータを送信し、デフォルトの送信を回避できる方法でデフォルトの送信を回避する必要があります。

于 2012-09-12T05:23:27.617 に答える
0

検証プラグインを一般的なフォーム送信関数にラップして、標準の実行を停止できます。

$('#formEnroll').on('submit', function(e)
{
    e.preventDefault(); // stop form submission

    // Run validation
    $(this).validate({
        errorElement:"p",
        submitHandler: function(form) {
            var phoneNumber = form.day_phone.value;             
            var phoneParts  = phoneNumber.split("-");
            form.dayArea.value = phoneParts[0];
            form.dayPrefix.value = phoneParts[1];
            form.daySuffix.value = phoneParts[2];               
            submitform(); // call your ajax function here
        }
    });
});

function submitform(){
    $.ajax({
        type: "POST",
        url: "/php/localProxy.php",
        data: $('#formEnroll').serialize(),
        success: function (response) {
                document.location = 'http://www.xxxx.com/thank-you';

    },
    error: function () {
        alert('There was a problem!');  // handle error
    }
});

イベント オブジェクトを使用する代わりに、関数の最後でデフォルト イベントの発生を停止eすることもできます。return false;.on

于 2012-09-12T04:37:10.163 に答える