jQuery Ajax冗余提交数据

我有我的jQuery AJAX提交过程的问题。jQuery Ajax冗余提交数据

的JavaScript：

$('#myform').submit(function() { 
    if (validateEvenInputs()) { 
     $('#btnevent').attr('disabled', 'disabled');  
     function getVirtualDirectory() { 
      var vDir = document.location.pathname.split('/'); 
      return '/' + vDir[1] + '/'; 
     } 

     var siteAddress = location.protocol + '//' + 
      document.location.hostname + getVirtualDirectory(); 
     var load_msg = '<span>Loading process....</span>'; 
     $("#enote").html(load_msg).slideDown(); 
     var abc = $('#abc').val(); 
     var def = $('#def option:selected').val(); 
     $.ajax({ 
      url: ""+ siteAddress +"page/action/", 
      global: false, 
      type: "POST", 
      data: ({en : abc, lv : def }), 
      dataType: "html", 
      async:false, 
      cache: false, 
      success: function($vmsg) { 
       $("#snote").html($vmsg).slideDown("slow"); 
       $("#enote").empty().slideUp(200); 
      } 
     });  
    } 

    return false; 
});

HTML：

<script type='text/javascript' > 
    $(document).ready(function() { 
     $('#abc').bind('keyup keydown', function() { 
     //run the character number check 

     if ($('#evname').val().length < max_chars) { 
      $('#evname_result').html(charnum_error).fadeIn("slow"); 
      $('#fsub').empty().fadeIn("slow");  
     } 

     else { 
      //else show the cheking_text and run the function to check 
      $('#evname_result').html(checking_html).fadeIn("slow"); 
      check_availability(); 
     } 
    }); 

    function check_availability() { 
     var abc = $('#abc').val(); 
     var submit_html = '<label class="frfrom"><input id="btnevent" name="Submit" 
      type="submit" value="Submit" /></label>'; 
     $.post(""+ siteAddress +"page/action/", { en: abc }, 
      function(result) { 

       //if the result is 1 
       if(result == 1) { 
        //show that the username is available 
        $('#evname_result').html('<h1 class="av">'+eventname + 
         ' is Available</h1>').fadeIn("slow"); 
        $('#fsub').fadeIn("slow", function() { 
         $('#fsub').html(submit_html); });      
        } 

       else { 
        //show that the username is NOT available 
        $('#evname_result').html('<h1 class="uv">'+eventname + 
         ' is Not Available</h1>').fadeIn("slow"); 
        $('#fsub').empty().fadeIn("slow");     
       } 
      }); 
     } 
    });  
</script> 
<form name="myform" id="myform" action=" 
    <?php echo $urlaction; ?>" method="post"> 
     <div id="frow"> 
      <label class="evname">Name 
       <input type="text" name="abc" id="abc" /> 
       <div id="evname_result"></div> 
      </label> 
      <label class="evcat">Level 
       <select name="def" title="Level" id="def" > 
        <option selected="selected"></option> 
        <option value="A">Level A</option> 
        <option value="B" >Level B</option> 
        <option value="C" >Level C</option> 
       </select> 
      </label> 
     </div> 
    <div id="fsub" ></div> 
</form>

我使用的PDO与MySQL来处理后端处理数据库。问题是当通过HTML表单提交的数据将为相同的表单字段添加两次时，所以我在数据库中获得了具有相同字段数据的冗余数据。

有谁知道如何防止这种情况？我的代码中是否有可见的错误？

来源

2011-05-12 dedudit

'async：false，'is evil。你真的需要同步AJAX吗？ – ThiefMaster 2011-05-12 06:36:35

你的表单上有提交按钮吗？如果是，请尝试将其更改为正常按钮。我怀疑表单是由默认提交按钮提交的，并且由Ajax再次提交 – boug 2011-05-12 06:37:28

您确定您的“返回false”阻止提交真正的HTML表单吗？小心做一个'event.preventDefault（）;'只是为了确定？我不知道你的''

也许你发布你的数据两次与Ajax和HTML张贴表单提交？你能在页面上显示html吗？

来源

2011-05-12 06:37:28 Danzan

我使用标准的HTML表单，只用于提交按钮，我从jquery POST动作渲染它的视图，我在我的问题添加HTML源。谢谢。 – dedudit 2011-05-12 07:08:23

您的表单提交两次似乎是可能的，因为您使用的是AJAX提交，然后表单再次提交。如果是这种情况，您可以通过告诉它停止其默认操作来阻止表单正常提交。

$('#myform').submit(function (event) { //add an event variable 
    event.preventDefault(); //stop default form submit action 

    //code for ajax form submit

这应该停止正常形式提交并且只使用你的ajax代码。

来源

2013-02-28 09:36:00

jQuery Ajax冗余提交数据

回答

相关问题