jQuery-Validation-Engine - combin with FormData send method

Question

I am using the jQuery FormData method for submitting a form and would like to combine it with the jQuery-Validation-Engine.

My code:

$(document).ready(function() {

    $("#myform").validationEngine(); 

    $(':submit').click(function(e){
        e.preventDefault();


        var formData = new FormData($('#myform')[0]);
        $.ajax({
            url: 'upload.php',
            type: 'POST',
            xhr: ...
            beforeSend: beforeSendHandler,
            success: completeHandler,
            error: errorHandler,
            data: formData,
            cache: false,
            contentType: false,
            processData: false
        });

    });



    function beforeSendHandler() { 

    }

With the above code, validation works when changing from input field to input field. But I need the final validation, when the user presses the submit button. And submitting should be stop if there is a validation error.

So, how do I integrate that feature? (Since this FormData actions seem to overwrite the validationEngine.)

Answer 1

try like this

$(':submit').click(function(e){
 $("#myform").validationEngine(
 {
  onValidationComplete: function(form, status){
      if(status == true){
        submitMessage();                
    }
 });
});

function submitMessage()
 {
var formData = new FormData($('#myform')[0]);
    $.ajax({
        url: 'upload.php',
        type: 'POST',
        xhr: ...
        beforeSend: beforeSendHandler,
        success: completeHandler,
        error: errorHandler,
        data: formData,
        cache: false,
        contentType: false,
        processData: false
    });

}