jQuery on submit function not working on form (with HAML)

Question

I've got below jQuery code to detect submit event and trigger some other javascript codes:

$('form#send-message').on('submit', function(){
      console.log('test');
      $('body').modalmanager('loading');
    });

This however does not work for:

.modal-header
  Contact info
  %button.close{ :type => 'button', 'data-dismiss' => 'modal', 'aria-hidden' => 'true' }
    ×
.modal-body
  = raw @booth.contact_info
  %hr
  = simple_form_for(@booth, url: booth_send_message_path, method: :post, html: { id: "send-message" }, remote: true) do |f|
    .form-group
      %textarea#message.form-control{name: "user[message]", placeholder: "Type your message here..."}
    %input{type: "hidden", name: "user[id]", value: "#{current_user.id}"}
    .form-actions
      %button.btn.btn-warning{:type => 'submit'} Send
      = f.error_notification

The id of the form is definitely matching but nothing seems to be triggered

Is there a reason why the event is not working?

Answer 1

input type=submit and button type=submit 

are different things. So just change button to input or bind callback to button click event

%input.btn.btn-warning{:type => 'submit'} Send

Answer 2

Try this in haml file:

.form-actions
  = f.button :submit, 'Send', class: 'button btn btn-warning'