Question

我有一个数据表页面，其中有一个引导模式对话框作为编辑页面。用户提交表单时，它将重复自页面加载以来执行的所有submit()操作。好吧，它重复了其中的一部分。

这是当有人编辑表的一行时调用的函数。 selectedRow是数据表行

function showEditDialog(selectedRow){
    var selectedRowData = selectedRow.data();
    var selectedRowIndex = selectedRow.index();
    console.log("showing dialog " + selectedRow.index());
    $("#editTitle").text(selectedRowData[0]);
    for(var col = 0; col < columnDefinitions.length; col++){
        //columnDefinitions is an array with metadata about each column
        // jquery wouldn't work for some reason
        document.getElementById(columnDefinitions[col].columnName + "_input").value = selectedRowData[col];
    }

    $("#modalEditDialog").modal();
    var frm = $('#editForm');
    frm.submit(function(event){
        console.log("submit " + selectedRowIndex);
        event.preventDefault();
        var theData = frm.serialize();
        $.ajax({
            method: 'POST',
            url: 'update.php',
            data: theData,
            success: function(theReply){
                console.log(theReply);
            },
            error: function(xhr, desc, err){
                alert(err);
            }
        });
        var formInputs = $("#modalEditDialog :input[id$=input]");
        for (var i = 0; i < formInputs.length; i++){
            theTable.cell(selectedRowIndex, i).data(formInputs[i].value);
        }
        $("#modalEditDialog").modal('hide');
    });
}

调用表单时，将所选行的数据复制到输入中，然后Submit函数将更新后的数据从表单复制回表中的所选行，并在服务器上进行更新。

这一切都很好用，除了每次调用时都会记住它被调用的所有时间，并从最后一次刷新表行开始，不同之处在于它会用当前的数据刷新它们。表格。

如果我查看控制台日志，则会看到以下内容：

//first time I hit the edit button
showing dialog 1428        tapeDB:183:17
submit 1428                tapeDB:193:21
updated 1428  successfully tapeDB:203:29 //from update.php

//next time I hit the edit button:
showing dialog 1427        tapeDB:183:17
submit 1428                tapeDB:193:21 //WTF?
submit 1427                tapeDB:193:21
updated 1427  successfully tapeDB:203:29 //from update.php

它是累积的，所以如果我再次调用它，它适用于三行，依此类推。起初我以为它也没有在进行ajax调用，但可能是这样，只是因为发送了来自表单的信息，服务器仅更新了一行。

这就是我叫编辑对话框的方式（daataa是我的表格）：

$("#daataa tbody").on('dblclick', 'tr', function(){
    showEditDialog(theTable.row("#"+this.id));
});

Answer 1

好的，原因是我对javascript有一个非常基本的误解。当我将功能附加到提交按钮时，每次显示表单时都会附加该功能，这意味着每次都会附加一个新功能副本。我通过从以前的任何实例中删除该函数来修复它：

{{1}}

每次提交时都会重复执行表单提交功能

1 个答案: