Question

我知道，关于这个问题已经有关于stackoverflow的几个主题了，但请相信我，我已经尝试了所有的东西而不是为我工作，所以我不得不发表这个话题

问题是，处理和提交表单有时需要大约30到40秒，用户往往会多次点击提交按钮。因此，发送多个请求并且数据不一致

我需要一些如何在发送帖子请求后禁用提交按钮，直到页面刷新为止！

我的平台是ASP.NET MVC - SQL Server

我的HTML：

using (Html.BeginForm()) { input type="submit" name="@mo" value="Save" id="Save" class="btn" /> }

下面是我正在使用的jquery，但它不起作用。仍然会发生多次点击。 Jquery的：

<script type="text/javascript"> $(document).ready(function () { $("form").submit(function () { $(this).submit(function () { return false; }); return true; }); }); </script>

Answer 1

在提交功能中禁用提交按钮：

$("form").submit(function () {
    $("#Save").attr("disabled", true);
});

Answer 2

您可以将return false与旗帜一起使用，该旗帜将负责您的表单状态。如果此标志为true，则不再提交表单。同时添加sending标记以防止多个表单提交。

＆＃13;

var $form = $('form'),
  $button = $('button', $form),
  $progress = $('#progress'),
  sending = false, // Ajax status
  submited = false; // Submit status


$form.on('submit',function(e){
  e.preventDefault(); // Prevent default to be able to send ajax request
  if (submited || sending) return; // If already submitted or in process, end here
  sending = true;
  
  $progress.css('display','block')
  
  $.ajax({
    url: 'https://jsonplaceholder.typicode.com/users',
    success: function(){
      submited = true;
      sending = false
      
      $button.attr('disabled', true);
      $progress.css('display','none')
    },
    error: function(){
      sending = false
    }
  })
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id='form'>
  <input type='text' />
  <button>Submit</button>
  <div id='progress' style='display:none'>Loading</div>
</form>

＆＃13;

Answer 3

如果你想复制粘贴。只需将上面的javascript代码替换为以下代码：

<script type="text/javascript"> 
 $(document).ready(function () { 
  $("form").submit(function (e) { 
   e.preventDefault();
   $('#Save').prop('disabled', true);
  $(this).submit();
 }); 
}); 
</script>

以上是您的捷径。但是当我读到这个时：

问题是，有时需要大约30到40秒来处理和提交表单和用户倾向于多次点击提交按钮。因此，发送多个请求并且数据不一致

我真的认为隐藏提交按钮不是解决问题的方法。这将导致您再次发布具有类似问题的另一个帖子。所以这样做（隐藏按钮）是没用的。

如果你愿意的话。您可以发送电子邮件至plonknimbuzz@gmail.com，我会发给您WA /电报。我希望在玩dota之前我们能找到解决方案

发送请求后禁用提交

3 个答案: