2015-11-26 161 views
5

使用php插入mysql文件通过AJAX调用。在insert声明php代码执行select查询到查找重复记录并继续到insert statement表单通过ajax提交两次POST

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

以及我试过error_log从插入函数调用两次。表单验证的

触发点

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

这是表单验证后如何提交:

}).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,核心PHP,mysqli的,Chrome浏览器。

实际JS:

  $(document).ready(function() { 
      $php_self_country="<?php echo $_SERVER['PHP_SELF']."?pg=countrycontent"; ?>"; 
      $("#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和写入到div的load-modal这是基本HTML文件。

<div class="modal-dialog"> 
<div class="modal-content"> 
    <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
     <h4 class="modal-title"><i class="fa fa-exchange"></i> <?php echo COUNTRYLABEL; ?></h4> 
    </div>  
    <div class="modal-body"> 
     <form role="form" method="POST" action="self.php" name="addcountryform" id="addcountryform" class="form-horizontal"> 
      <div class="form-group"> 
       <div class="col-xs-3"> 
       <label for="countryname" class="pull-right">Country Name</label> 
       </div> 
       <div class="col-xs-9"> 
       <div class="lnbrd"> 
       <input type="text" class="form-control" name="countryname" placeholder="Enter Country Name"> 
       </div> 
       </div> 
      </div> 
      <div class="form-group"> 
       <div class="col-xs-3"> 
       <label for="crncyname" class="pull-right">Currency Name</label> 
       </div> 
       <div class="col-xs-9"> 
       <div class="lnbrd"> 
       <input type="text" class="form-control" name="crncyname" placeholder="Enter Currency Name"> 
       </div> 
       </div> 
      </div> 
      <div class="form-group"> 
       <div class="col-xs-3"> 
       <label for="crncycode" class="pull-right">Currency Code</label> 
       </div> 
       <div class="col-xs-9"> 
       <div class="lnbrd"> 
       <input type="text" class="form-control" name="crncycode" placeholder="Enter Currency Code"> 
       </div> 
       </div> 
      </div> 
      <div class="form-group"> 
       <div class="col-xs-3"> 
       <label for="forrate" class="pull-right">Foreign Currency Rate<?php echo isset($icon)?$icon:''; ?></label> 
       </div> 
       <div class="col-xs-9"> 
       <div class="lnbrd"> 
       <input type="text" class="form-control" name="forrate" placeholder="Enter Foreign Currency Rate."> 
       </div> 
       </div> 
      </div> 
      <div class="form-group"> 
       <div class="col-xs-3"> 
       <label for="taxpercent" class="pull-right">Tax &#37;</label> 
       </div> 
       <div class="col-xs-9"> 
       <div class="lnbrd"> 
       <input type="text" class="form-control" name="taxpercent" placeholder="Enter Tax Percentage"> 
       </div> 
       </div> 
      </div> 
     </form>   
    </div> 
    <div class="modal-footer clearfix"> 
     <button type="button" class="btn btn-danger pull-right" id="addcountryformsubmitbtn">Add</button> 
    </div> 
</div> 

注: - 在视图代码库点按预期工作。

+0

你可以显示'#addcountryformsubmitbtn'的HTML吗?请检查它是否有'type =“按钮”'属性。 – sp00m

+0

@ sp00m找到有问题的HTML。 _tried both_'type =“button”'和'type =“submit”'输出仍然相同。 –

回答

0

我见过的一些事情可能是原因。

如果您使用的是IE,我已经看到在执行POST之前立即执行GET(对于相同的URL,并且发送了相同的数据),所以可能值得尝试在服务器上检查它(并忽略GET)

其他的东西,它可能会添加以下到AJAX调用后的按钮点击事件的结尾(实际上,通常我会把第一行放在顶部,防止默认,以及返回声明显然走得最后)...

e.stopImmediatePropagation(); 
return false; 
+0

其工作!只是在所有'e.preventDefault();'旁边加了'e.stopImmediatePropagation();',并没有使用'return false;';未来会引起问题吗?在IE10和Chrome中测试:) –