Rails 4: Disable submit button after click

jquery ruby-on-rails ruby-on-rails-4 ujs
Albert picture Albert · Feb 16, 2014 · Viewed 26.6k times · Source

I have a form_tag(foo_path(@foo), remote: true, id: 'foo-form' form and a submit button submit_tag ("Submit", :id => "foo-submit")

I'd like to disable the submit button after it has been clicked. Obviously, I cannot use something like onlick="jQuery(this).prop('disabled', true);" because it would break the remote functionality. I'm aware of the :disable_with data attribute for the submit_tag but it doesn't seem to work for me. It does generate the right form code but it has no effect. I'm not sure why it doesn't work but it might be due to the fact that I use prototype (legacy reasons) and jquery at the same time. Though, I only load ujs for jquery and not for prototype. However, all other query_ujs features work very well.

Is there another way to disable the submit button?

Answer

dileep nandanam picture dileep nandanam · Feb 16, 2014

use

submit_tag "Submit", id: "foo-submit", data: { disable_with: "Please wait..." }

Related questions

couldn't find file 'jquery' with type 'application/javascript'

This might seem a repeated question but none of the solutions seem to work for me. I have gem jquery-rails in my Gemfile. Also, the lines //= require jquery //= require jquery_ujs //= require turbolinks //= require_tree . And this is my Gemfile: …

Read More
jQuery: how to change title of document during .ready()?

I am using some nested layouts in Ruby on Rails, and in one of the layouts i have a need to read in a string from a div and set that as the title of the document. What is correct …

Read More
How to get the selected date value while using Bootstrap Datepicker?

Using jquery and the Bootstrap Datepicker, how do I get the new date value I selected using the Bootstrap Datepicker? FYI, I'm using Rails 3 and Coffescript. I set up the datapicker using: <input id="startdate" class="span2 datepicker" type="…

Read More