How to trigger validationEngine with $.ajax submit?

Question

I'm using an inline function to submit a form but it's not calling the validation script I have and I wondered if anyone could point me in the right direction of an answer?

My button:

<a href="javascript:UpdateEnquiry();" id="continue_btn" class="btnSprite">Save</a>

My Function:

function UpdateEnquiry() {

$.ajax({
  url: 'test.php',
  dataType: 'xml',
  timeout: 15000,
  type: 'post',
  data: $('#validate').serialize(),
  success: UpdateEnquirySuccess,
  error: function (result) {parent.$.fancybox.close();}
  });
}

And I would like to initialise the jquery validationEngine plugin before submit. http://www.position-absolute.com/articles/jquery-form-validator-because-form-validation-is-a-mess/

Any help would be hugely appreciated.

Kind regards Rachel

mgibsonbr · Accepted Answer · 2013-04-11 01:35:57Z

4

Assuming your validation engine is already initialized, call the validate method before doing the ajax request. If that method returns true, you proceed:

function UpdateEnquiry() {
    if ( $(yourForm).validationEngine('validate') ) {
        $.ajax({
            ...
        });
    }
    else {
        // The form didn't validate
    }

    return false; // Prevents default action from happening
}

edited Apr 11, 2013 at 1:35

answered Mar 26, 2012 at 10:10

mgibsonbr

22.1k7 gold badges74 silver badges115 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Rachel Over a year ago

Thanks so much! I often find that i overcomplicate solutions so apologies for the total noobie question...

jack Over a year ago

this is not working... Its wrong answer form is always false ajax is not triggering.

mgibsonbr Over a year ago

@jack What exactly is wrong with my answer? validationEngine('validate') will return true if the form validates, according to the docs, if it's always returning false: a) your form is wrong; or b) the plugin is wrong. If I'm missing something, please give more details, so I can fix the answer.

jack · Accepted Answer · 2013-03-27 06:44:29Z

4

$('#registerform').submit(function(e) {
                e.preventDefault();
                var vars = $("#registerform").serialize();

                if ($("#registerform").validationEngine('validate')) {

                    $.ajax({
                            url:"sample.php"
                    });

                }
            });

without stopping default action i was redirecting to my form action page. So had to use preventdefault(). @mgibsonbr my bad

answered Mar 27, 2013 at 6:44

jack

4735 silver badges21 bronze badges

2 Comments

mgibsonbr Over a year ago

Ok, I get it now, whether the form validates or not, the default action should not happen - since it will be superseded by the Ajax call. I really missed this detail, thanks for pointing that out!

jack Over a year ago

hope you can click on useful link :)

Collectives™ on Stack Overflow

How to trigger validationEngine with $.ajax submit?

2 Answers 2

3 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related