JQuery Ajax избыточной отправки данных

Question

У меня проблема с процессом отправки 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-форму, они добавляются дважды для одного и того же поля формы, поэтому я получил избыточные данные с одинаковыми полевыми данными в базе данных.

Кто-нибудь знает, как это предотвратить? Есть ли видимые ошибки в моем коде?

Answer 1

Возможно, что ваша форма отправляется дважды, потому что вы отправляете с использованием AJAX, а затем форма отправляется снова. Если это так, вы можете довольно легко помешать форме выполнить обычную отправку, сказав ей прекратить действие по умолчанию.

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

    //code for ajax form submit

Это должно остановить нормальную отправку формы и использовать только ваш код ajax.

Answer 2

Может быть, вы публикуете свои данные два раза с помощью ajax и html post form?Можете ли вы показать HTML на странице?