表单通过ajax POST提交两次

使用通过AJAX调用的php文件插入mysql 。 在insert语句之前，php代码执行select查询以查找重复记录并继续insert statement 。

问题 ：从ajax调用php文件时。 它执行了两次并获得响应作为重复记录。

好吧，我尝试了插入函数的error_log ，它被调用了两次。

表单validation的触发点

 $("#load-modal").on("click","#addcountryformsubmitbtn",function(e){ e.preventDefault(); var $form = $("#addcountryform"), $url = $form.attr('action'); $form.submit(); }); 

这是validation后提交表单的方式：

 }).on('success.form.bv', function(e){ e.preventDefault(); var $form = $("#addcountryform"), $url = $form.attr('action'); $.post($url,$form.serialize()).done(function(dte){ $("#load-modal").html(dte); }); }); 

使用bootstrapvalidator，Core PHP，mysqli，Chrome浏览器。

实际的JS：

  $(document).ready(function() { $php_self_country=""; $("#country-content").load($php_self_country,loadfunctions); $("#country-content").on( "click", ".pagination a", function (e){ e.preventDefault(); $("#country-loading-div").show(); var page = $(this).attr("data-page"); $("#country-content").load($php_self_country,{"page":page}, function(){ $("#country-loading-div").hide(); loadfunctions(); }); }); $("#country-content").on("click","#closebtn",function(e){ e.preventDefault(); $("#country-content").load($php_self_country,loadfunctions); }); }); function loadfunctions(){ $("[data-toggle='tooltip']").tooltip(); $("#country-content").on("click","#addcountrybtn, #addcountrylargebtn",function(e){ e.preventDefault(); $.ajax({ url: $php_self_country, type: "POST", data: { 'addcountry':'Y' }, dataType: "html", cache: false }).done(function(msg){ $("#load-modal").html(msg); $("#load-modal").modal('show'); $('input[type="radio"]').iCheck({ checkboxClass: 'icheckbox_minimal', radioClass: 'iradio_minimal' }); modalvalidation(); }).fail(function() { $("#load-modal").html( "Request Failed. Please Try Again Later." ); }); }); $("#country-content").on("click",".tools a",function(e){ e.preventDefault(); var recordid = $(this).attr("record-id"); $.ajax({ url: $php_self_country, type: "POST", data: { 'modifycountry':recordid }, dataType: "html", cache: false }).done(function(msg){ $("#load-modal").html(msg); $("#load-modal").modal('show'); $('input[type="radio"]').iCheck({ checkboxClass: 'icheckbox_minimal', radioClass: 'iradio_minimal' }); modalvalidation(); }).fail(function() { $("#load-modal").html( "Request Failed. Please Try Again Later." ); }); }); $("#load-modal").on("click","#addcountryformsubmitbtn",function(e){ e.preventDefault(); var $form = $("#addcountryform"), $url = $form.attr('action'); $form.submit(); }); $("#load-modal").on("hide.bs.modal", function () { window.location.href=$php_self_country_pg; }); } function modalvalidation(){ $('#addcountryform').bootstrapValidator({ message: 'This value is not valid', feedbackIcons: { valid: 'glyphicon glyphicon-ok', invalid: 'glyphicon glyphicon-remove', validating: 'glyphicon glyphicon-refresh' }, fields: { [-------Validation part comes here----------] } }).on('success.form.bv', function(e){ e.preventDefault(); var $form = $("#addcountryform"), $url = $form.attr('action'); $.post($url,$form.serialize()).done(function(dte){ $("#load-modal").html(dte); }); }); } 

HTML

通过AJAX按钮单击addcountrybtn调用此html并写入基本html文件中的div load-modal 。

 
 
 
 × 
 
 
 
 
 
 
 Country Name 
 
 
  
 
 
 
 
 Currency Name 
 
 
  
 
 
 
 
 Currency Code 
 
 
  
 
 
 
 
 Foreign Currency Rate 
 
 
  
 
 
 
 
 Tax % 
 
 
  
 
 
 
 
 
 Add 
  

注意： – 在数据库的角度来看，代码按预期工作。

Answer 1

我见过的几件事可能是原因。

如果您正在使用IE，我已经看到在执行POST之前立即执行GET（对于相同的URL，发送相同的数据），因此可能值得尝试在您的服务器上检查它（并忽略得到）

在AJAX调用之后，可能会在按钮单击事件的末尾添加以下内容（实际上，通常我会将第一行放在顶部并使用prevent default，而return语句显然是最后一次）。 。

 e.stopImmediatePropagation(); return false;