Rails 数据禁用-带重新启用按钮

问题描述

我有一个带有 javascript 验证的 Rails Devise 表单.当用户按下提交时，验证工作并且用户重新关注他们需要的表单.

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.

然而，rails 使用 data-disable-with 在按钮被点击后禁用按钮，因此验证后用户不能再点击提交.我正在尝试设置某种侦听器来检查按钮何时被禁用，稍等片刻以防止双击，然后重新启用按钮.

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.

我尝试了很多次代码迭代，最近一次尝试的是:

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

但这失败了，因为它在禁用按钮的函数(隐藏在 rails ether 中)之前运行，因此不起作用.

But this failed because it ran before the function (hidden in rails ether) that disabled the button so did not work.

我的提交按钮很简单:

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

有人可以帮我吗?我想如果我可以禁用此页面的 jQuery_ujs 会起作用，但不确定我是否可以这样做.

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.

推荐答案

我设法非常简单地解决了这个问题.我刚刚进入并从带有代码的按钮中删除了数据禁用:

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.

这篇关于Rails 数据禁用-带重新启用按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！