javascript - 多次将相同的记录添加到数据库而不是一次

Question

我对 php 脚本有疑问，它添加的记录比预期的要多。我有一张大 table ，里面有几个“子表”，里面有人们的薪水及其分布:

名称#PayRate#分布#年度

John Smith # 10,000 # 20.00% # 50,000 # edit # delete
小飞侠#100,000#100.00%#100,000#编辑#删除

添加新人

当您点击新人时，弹出表单，您键入所有信息，将人员添加到数据库，ajax 返回信息并将人员添加到列表末尾。这是问题，当我在一个“子表”中单击添加人时，它添加了一个人并正确打印，但是当我转到第二个“子表”并添加一个人时，它会添加人两次(插入两个相同的记录到数据库)，如果我点击第三个“子表”上的添加人，它将添加一条记录三次......它应该只添加一次记录。这是我的 js 脚本:

$('.addbtt').on('click', function(){
    value= "";
    document.getElementById("updform").reset();
    var glnumber = $(this).parent().parent().find('#glno').text();
    var objid = glnumber.substring(7,12);
    value += glnumber.substring(10,12);
    if(objid=='51001'){
        $('.modal-title').html("Add person - Full time");
        $('#glnumber').empty().val(glnumber);
    }else if(objid=='51002'){
        $('.modal-title').html("Add person - Part time");
        $('#glnumber').empty().val(glnumber);
    }else if(objid=='51009'){
        $('.modal-title').html("Add person - GA");
        $('#glnumber').empty().val(glnumber);
    }else if(objid=='51010'){
        $('.modal-title').html("Add person - GE");
        $('#glnumber').empty().val(glnumber);
    };

    $('#updform').submit(function(){
        var formData = $(this).serialize();
        $.post('includes/updatesal.php',formData,processData);
        function processData(data){
            if(value == 01){
                $('#addperson1').before(data);
            }else if(value == 02){
                $('#addperson2').before(data);
            }else if(value == 09){
                $('#addperson3').before(data);
            }else if(value == 10){
                $('#addperson4').before(data);
            }else{
                alert("Your are doing something you shouldn't! :)") 
            };
        }; //end of processData
        return false;
    });
});

我认为问题出在我的“添加人员按钮”上，因为它还向数据库中添加了两条记录。这是我的 php 函数:

$insertSQL1 = "INSERT INTO salaries (gl_number,name,pay_rate,distribution,annual)
                VALUES ('".$glnumber."','".$name."','".$payRate."','".$dist."','".$annual."')";
        $insertSQL1 .= "; SELECT SCOPE_IDENTITY() AS RECORD_ID";    
        $stmt1 = sqlsrv_query(Database::GetInstance()->databaseConnection, $insertSQL1);
        # IF THERE IS AN ERROR
        if(!$stmt1){
            echo "Error";   
        }else{
            $id = Database::GetInstance()->LastInsertId($stmt1);
        }
        # IF ALL QUERIES WERE SUCCSESSFUL, COMMIT THE TRANSACTION, OTHERWISE ROLLBACK
        if($stmt1 && !$errors){
            sqlsrv_commit(Database::GetInstance()->databaseConnection);
            # FREE THE STATEMENT
            Database::GetInstance()->FreeDBStatement($stmt1);

我已经花了一个星期的时间来解决这个问题，有人可以帮忙吗？

Answer 1

问题是由您的 .submit() 事件处理程序在 .click() 事件处理程序中引起的 - 所以您每次点击都会创建一个新的、相同的 .submit() 处理程序。

要修复，只需将 .submit() 处理程序从那里取出:

$('.addbtt').on('click', function(){
    value= "";
    document.getElementById("updform").reset();
    var glnumber = $(this).parent().parent().find('#glno').text();
    var objid = glnumber.substring(7,12);
    value += glnumber.substring(10,12);
    if(objid=='51001'){
        $('.modal-title').html("Add person - Full time");
        $('#glnumber').empty().val(glnumber);
    }else if(objid=='51002'){
        $('.modal-title').html("Add person - Part time");
        $('#glnumber').empty().val(glnumber);
    }else if(objid=='51009'){
        $('.modal-title').html("Add person - GA");
        $('#glnumber').empty().val(glnumber);
    }else if(objid=='51010'){
        $('.modal-title').html("Add person - GE");
        $('#glnumber').empty().val(glnumber);
    };
});

$('#updform').submit(function(){
    var formData = $(this).serialize();
    $.post('includes/updatesal.php',formData,processData);
    function processData(data){
        if(value == 01){
            $('#addperson1').before(data);
        }else if(value == 02){
            $('#addperson2').before(data);
        }else if(value == 09){
            $('#addperson3').before(data);
        }else if(value == 10){
            $('#addperson4').before(data);
        }else{
            alert("Your are doing something you shouldn't! :)") 
        };
    }; //end of processData
    return false;
});