I'm using Ruby on Rails, Formtastic gem, jQuery and ketchup to validate my form.

I'm submitting the form created by Formtastic inside a modal box using ajax:

<% semantic_form_remote_for @contact_form, :url => '/request/contact' do |f| %>

I have a validation plugin verifying the fields on the form:

$(document).ready(function() { 
  $("#new_contact_form").ketchup();
}); 

The problem is that semantic_form_remote_for generates an onSubmit ajax request that the jQuery validation plugins won't prevent, since it's not a normal form submission.

One question on stackoverflow suggests using :condition on the remote form declaration to fire a javascript function, but I can't do that since I'm not using a function, but rather relying on a jQuery handler.

I also tried putting ketchup within a submit event handler:

$(document).ready(function() { 
  $("#new_contact_form").submit(function() {
    $('#new_contact_form').ketchup();
  });
}); 

No luck. Form still submits.

I also tried using the beforeSend option of jQuery.ajax:

$(document).ready(function() { 
  jQuery.ajax( {
    beforeSend: function(){ $('#new_contact_form').ketchup(); }
   });
}); 

Validation fires off, but form is still submitted.

I switched to jQuery Validation plugin just to see if it was due to some limitation in Ketchup. It turns out that Validation has a submitHandler option:

$(document).ready(function() { 
  $('#new_contact_form').validate({
    submitHandler: function(form) {
      jQuery.ajax({
        data:jQuery.param(jQuery('#new_contact_form').serializeArray()), 
        dataType:'script', 
        type:'post', 
        url:'/request/contact'
      });
      return false;
    }
  }); 
});

This works when I use a regular semantic_form_for instead of semantic_form_remote_for, but alas, I would rather use Ketchup.

Is Ketchup just woefully lacking? Am I forced to use jQuery Validation?