I have a remote form in my rails app:

<%= form_for(@list_item, :remote => true) do |f| %>
  .............
  .............
  <%= f.submit("Add It!", class: "btn") %>
<% end %>

It's contained in a Bootstrap modal with id 'addListItem'. I want to dismiss this modal after submitting the form. I've found a few similar questions on SO, but none that has answered this in a way that prevents the form from submitting BEFORE the modal is closed. Help please?

I have a remote form in my rails app:

<%= form_for(@list_item, :remote => true) do |f| %>
  .............
  .............
  <%= f.submit("Add It!", class: "btn") %>
<% end %>

It's contained in a Bootstrap modal with id 'addListItem'. I want to dismiss this modal after submitting the form. I've found a few similar questions on SO, but none that has answered this in a way that prevents the form from submitting BEFORE the modal is closed. Help please?

• javascript
• ruby-on-rails
• forms
• twitter-bootstrap

• Are you responding w/ a js.erb template on your create action? – Helios de Guerra Commented May 6, 2014 at 2:28
• No, there's nothing to update on the page. – settheline Commented May 6, 2014 at 3:13

2 Answers 2

To dismiss the modal after form submit.

JavaScript

$('#form_id').on('submit', function() {
  $('#addListItem').modal('hide');
});

Add a click event on your submit button using jQuery:

$('.btn').click(function() {
  $('#addListItem').modal('toggle');
});