Rails data-disable-with-re-enabled按钮

Question

我有一个Rails Devise表单,它有javascript验证.当用户按下提交时,验证工作,用户重新聚焦在他们需要的表单上.

但是,rails使用data-disable-with在单击按钮后禁用该按钮,因此在验证后用户无法再单击提交.我试图设置某种监听器来检查按钮何时被禁用,等待一会儿以防止双击,然后重新启用按钮.

我尝试了很多代码迭代,我尝试的最新版本是:

      $(document.on("ajax:success", "new_supplier", function() {
      var button;

      button = $(this).find('.btn-sign-up');
      setTimeout((function() { return button.disabled=false; }),1);


      });

但是没有成功,之前我尝试过只为按钮添加一个监听器:

      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;
      }

但这失败了,因为它在禁用按钮的功能(隐藏在rails ether中)之前运行,因此无效.

我的提交按钮很简单:

    <%= f.submit "Create my account", class: 'btn-sign-up', id: 'btn-sign-up' %>

有人可以帮我从这里出去吗？我想如果我可以为这个可以工作的页面禁用jQuery_ujs,但不确定我是否可以这样做.

Answer 1

在Rails 5中,此行为已更改,现在默认情况下禁用提交.

我建议使用以下配置,而不是接受答案:

config.action_view.automatically_disable_submit_tag = false

或者,为特定按钮临时执行此操作,将其添加到提交按钮

data: { disable_with: false }

Answer 2

这有助于给我一个关于要寻找什么的提示.如果有人正在查看如何在您的html.erb文件中更正此问题,这是我的解决方案:

<p>
  <%= f.submit 'Submit', data: { disable_with: false } %>
</p>

Answer 3

看我的回答。

$button = $('#someId')
$.rails.enableElement($button)
$button.removeAttr('disabled')

/sf/answers/3102315051/

Answer 4

我很简单地解决了这个问题。我刚刚进去并使用代码从按钮中删除了 data-disable-with ：

    $('#my-button').removeAttr('data-disable-with');

然后在准备提交表单时重新建立该属性，以防止双击创建重复项。