Question

I have this form in HAML:

= form_for([:mobile,@disclosure], :html => {:id => "add_validation_to_ajax_form", :remote => true}) do |f|

but the add_validation_to_ajax_form function has a a parameter like this:

function add_validation_to_ajax_form(form_selector){
    alert ("hello :)");
    add_custom_validation_methods();
    $(form_selector).submit(function(event) {
      force_ckeditor_to_update();
    }).validate({meta:"validate",onkeyup:false,validClass:"ok-input",
          errorPlacement: function(error, element) {

          }
      });
}

And I am new to the HAML syntax of how it is supposed to call the JavaScript function. Right now when the form is submitted, this function is not displaying the hello popup. Any idea why it isn’t working?

Thanks!

Answer 1

That’s because you’re not calling the function anywhere. If you want it to execute you have to call it.

Try adding this to your application.js file.

$(function() {
  add_validation_to_ajax_form('form#add_validation_to_ajax_form');
});

That will call your function. However, I think the function you WANT to have looks more like this:

$(function() {
  $('form#add_validation_to_ajax_form').submit( function() {
    alert ("hello :)");
    add_custom_validation_methods();
    force_ckeditor_to_update();
    $(this).validate({
      meta:"validate",
      onkeyup:false,
      validClass:"ok-input",
      errorPlacement: function(error, element) {}
    });
  });
});

The $(function(){ ... }); call in jQuery means: do this when the page is finished loading.

The $(selector).submit( function(){...}); function means, find the selector on the page, and attach a submit event handler to it, so that when the form is submitted the stuff in this function happens.

If you must embed something like this in HAML you can by indenting behind :javascript, like so:

:javascript
  $(function(){ alert('The page is loaded!') });

HAML really has nothing to do with whether or not your function is called though. HAML creates HTML. All HAML needs to do is include the javascript files somewhere, (javascript_include_tag). In Rails > 3.1.x the best practice is for your layout to include your application.js file, and for the rest of your javascripts to be loaded through that.