Rails 4:点击后禁用提交按钮

我有一个form_tag(foo_path(@foo), remote: true, id: 'foo-form'表单和一个提交按钮submit_tag ("Submit", :id => "foo-submit")

我想在点击后禁用提交按钮。 显然,我不能使用onlick="jQuery(this).prop('disabled', true);" 因为它会打破远程function。 我知道:disable_with submit_tag的:disable_with数据属性,但它似乎对我不起作用。 它确实生成了正确的表单代码,但它没有任何效果。 我不确定它为什么不起作用,但可能是因为我同时使用原型(遗留原因)和jquery。 虽然,我只为jquery而不是原型加载ujs 。 但是,所有其他query_ujsfunction都可以正常工作。

还有其他方法可以禁用提交按钮吗?

使用

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

submit_tag的替代方法是button_tagbutton_tag允许您添加字体真棒微调器。

 <%= button_tag 'Submit', class: 'btn btn-primary', data: { disable_with: "  Submitting Changes..."} %> 

您可以使用CoffeeScript执行以下操作:

 jQuery -> $('.theform').submit -> $('input:submit').attr("disabled", true) 

当提交class="theform"的表单时,这将禁用表单提交按钮。 根据您的需要,您可以根据表单的类/ ID进行调整。

该问题是由无效的HTML代码引起的。 请参阅

break

disable_with现在可以使用

由于它是一个ajax调用,因此将触发相应操作的结果js.erb文件。

禁用点击算法可以放在这个js.erb文件中。

 # in the controller def foo_method ... # will render js.erb for ajax call # assuming there is no .html view file in the directory end # in foo_method.js.erb $('input:submit').attr("disabled", true); 

它应该会在禁用按钮noew的情况下将您带到同一页面