jQuery Plugin Conflict - Validate and jQuery Form

Question

I have a site that uses jQuery Validate (jQuery Validate) and jQuery Form (jQuery Form). My issue is that when I use the success callback on ajaxSubmit, when the success callback gets called on Validate, ajaxSubmit success' callback gets called.

I ajax the form here, and have the submitHandler set to ajaxSubmit under Validate:

/******* Validate Function Options (not complete function) ************/
success: function(label) {
  label.addClass("checked");
}, 
submitHandler: function(form) {
  $(form).ajaxSubmit();
}

/******* AjaxForm Options/Initilization ************/

var options = { 
  target: '#server-response',       
  success: showResponse,
};

$('#consultation-form').ajaxForm(options);

My dilemma is that when validation is successful (calling the success callback on validation) it calls the success callback from AjaxForm options as well. Spent the last hour on here looking around, that's how I found the submitHandler.

JsFiddle here, won't work because of my post, but it's the js and html in entirety. http://jsfiddle.net/UUDb6/

Thanks for any advice you might have.

I think the problem is that both ajaxSubmit and Validate use the same PHP script when they make the call to the server. So both frameworks are listening for a response from the same script. Is it possible to use separate scripts for the ajax and validate parts respectively? — jeffery_the_wind

jeffery_the_wind jeffery_the_wind · Accepted Answer · 2012-07-23T18:48:06

it looks like you can define a custom URL in the options for jQuery validate and ajax form respectively. eg:

$("#myform").ajaxForm({
   url: "mypage1.php",
   type: "POST",
   ...
 });

$("#myform").validate({
   url: "mypage2.php",
   type: "POST",
   ...
 });

and you can use similar options for $(form).validate(options);

You could make a copy of your PHP callback script and change the name, so the validate function uses one script, and the ajaxSubmit uses another.

jQuery Plugin Conflict - Validate and jQuery Form

1 Answers