Javascript Rails 数据禁用-带重新启用按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/42016113/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Rails data-disable-with re-enabling button
提问by Ryan Murphy
I have a Rails Devise form that has javascript validation. When the user presses submit, the validation works and the user is refocused on the form where they need to be.
我有一个带有 javascript 验证的 Rails Devise 表单。当用户按下提交时，验证工作并且用户重新聚焦在他们需要的表单上。
However, rails uses the data-disable-with to disable the button after it has been clicked, so after the validation the user cannot click submit anymore. I am trying to set up some kind of listener to check when the button has been disabled, wait a little while to prevent double clicks, then re-enable the button.
但是，rails 使用 data-disable-with 在单击后禁用按钮，因此验证后用户不能再单击提交。我正在尝试设置某种侦听器来检查按钮何时被禁用，稍等片刻以防止双击，然后重新启用按钮。
I have tried many iterations of code, the latest I tried was:
我已经尝试了很多次代码迭代，我尝试过的最新一次是：
$(document.on("ajax:success", "new_supplier", function() {
var button;
button = $(this).find('.btn-sign-up');
setTimeout((function() { return button.disabled=false; }),1);
});
But had no success, previously I tried just adding a listener to the button:
但是没有成功，以前我尝试只向按钮添加一个侦听器：
var button = document.getElementById('btn-sign-up');
button.addEventListener("click", enableButton);
function enableButton() {
if (button.disabled)
{
window.setTimeout(enable(), 2000);
}
}
function enable() {
button.disabled=false;
}
But this failed because it ran before the function (hidden in rails ether) that disabled the button so did not work.
但这失败了，因为它在禁用按钮的函数（隐藏在 rails ether 中）之前运行，因此不起作用。
My submit button is a simple:
我的提交按钮很简单：
<%= f.submit "Create my account", class: 'btn-sign-up', id: 'btn-sign-up' %>
Can anyone help me out here? I think if I can disable the jQuery_ujs for this page that would work, but not sure if I can do that.
有人可以帮我从这里出去吗？我想如果我可以禁用此页面的 jQuery_ujs 会起作用，但不确定我是否可以这样做。
采纳答案by Ryan Murphy
I managed to solve this quite simply. I just went in and removed the data-disable-with from the button with the code:
我设法很简单地解决了这个问题。我刚刚进入并从带有代码的按钮中删除了数据禁用：
$('#my-button').removeAttr('data-disable-with');
And then re-establishing the attribute when the form was ready to be submitted to prevent double clicks from creating duplicates.
然后在表单准备提交时重新建立该属性，以防止双击创建重复项。
回答by macav
This behaviour was changed in Rails 5, now it's disabling submits by default.
此行为在 Rails 5 中已更改，现在默认禁用提交。
Rather than accepted answer, I would suggest to use the following configuration:
我建议使用以下配置，而不是接受答案：
config.action_view.automatically_disable_submit_tag = false
or, to do it ad-hoc for specific buttons, add this to the submit button
或者，要对特定按钮进行临时操作，请将其添加到提交按钮
data: { disable_with: false }
回答by jasmineq
This was helpful to give me a hint on what to look for. If anyone is looking how to correct this in your html.erb file, this was my solution:
这有助于给我一个关于寻找什么的提示。如果有人正在寻找如何在您的 html.erb 文件中更正此问题，这是我的解决方案：
<p>
<%= f.submit 'Submit', data: { disable_with: false } %>
</p>
回答by waqas ali
Look at my answer.
看看我的回答。
$button = $('#someId')
$.rails.enableElement($button)
$button.removeAttr('disabled')
