Jquery Ajax双峰会

Question

我有这个问题，我的表单重复发布数据(在表格中通过单击创建了2个条目)。我遵循了有关stackoverflow的建议，但似乎什么都不起作用。问题可能是什么？我是一个使用AJAX的新手，所以我不得不假设我在做一些愚蠢的事情。

此脚本的基本逻辑是，提交并保存数据，如果成功返回成功，则重定向，否则在DIV中显示带有错误消息的输出。

我尝试过的建议：

How can I prevent a double submit($.post) with jQuery

jquery ajax form submits twice

Prevent double submission of forms in jQuery

到目前为止我的代码：

$(document).ready(function() {
  $("#go").click(function(e) {
    e.preventDefault()
    e.stopImmediatePropagation();
    $.ajax({
      type: "POST",
      url: "controllers/newcases_controller.php",
      data: $('#casedata').serialize(),
      success: function(response) {
        if (response == 'success')
          window.location.replace("listcases.php");

        else
          /* clear old results, then display the new results */
          $("#divResults").empty().append(response);
      }
    });

    return false;
  });
});

这是表单的一部分，但我假设您只是希望查看按钮是如何定义的

<form role="form" class="form-horizontal" id="casedata">    
    <div class="form-group">
      <label class="col-sm-12" for="TextArea">Additional Address Details [ Max 200 Characters ] <span id="countdown2"></span></label>
      <div class="col-sm-12"><textarea class="form-control" id="additionaladdressdetails" name="additionaladdressdetails" placeholder="e.g Unit 123, Complex Street Name"></textarea></div>
    </div>



    <div class="form-group">
      <div class="col-sm-12">
        <button type="reset" class="btn btn-default pull-right">Cancel</button>
        <button type="button" id="go" name="go" class="btn btn-primary pull-right">Create Case</button>     
      </div>
    </div>

</form> 

建议下一步尝试？

Answer 1

我认为使用以下命令总是不好的：

   e.preventDefault()
    e.stopImmediatePropagation();

你应该有一个变通的办法。

我不知道你的双重提交的来源是什么，但它可能来自1/ $("#go").click事件被注册了两次。也许你可以检查一下。2/正如评论中所说，你的#go是一个type="submit“。

解决方案:可以在提交时取消激活该按钮

 $("#go").click(function(e) {
$("#go").prop( "disabled", true )
$.ajax({
      type: "POST",
      url: "controllers/newcases_controller.php",
      data: $('#casedata').serialize(),
      success: function(response) {

    },
     complete:function(){
           $("#go").prop( "disabled", false)
    }
);
})

Answer 2

我要感谢每个人的帮助。我发现了问题所在。到头来都是些愚蠢的事情。当我浏览我的后端代码时，我发现我执行了两次PHP PDO execute语句。我已经修复了它，现在一切都按预期工作了。@stefdelec建议查看事件是否注册了两次建议我发现它只发送了一次，因此必须是其他东西，而不是JQUERY。