Question

I have a form validation run when the submit button is selected but i do not want the default submit function to run. Instead i want to run an ajax post code to store the data in the form along with post the data from server side.

I am having trouble finding where to cancel the default submit and add in the ajax code.

Here is the validate code i have

    $("#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();
    }

});

And here is the ajax code i want to run instead of the default submission

$.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
    }
        });

Answer 1

you can call the the ajax function instead of form.submit();
form.submit(); will submit your code using default submission.

  $('#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
        }
    });

    }