从JQuery数据表中删除行

时间:2013-10-02 11:16:29

标签: jquery datatables

您好我正在使用fnDeleteRow函数删除表中的行,但问题是它第一次删除了正确的行而不是开始删除下一行而不是我按下的那一行删除按钮。

这是我的代码

$(document).ready(function() {
        $(document).delegate('.but', 'click', function() { 

            var id = this.id; //getting the ID of the pressed button
            var name = this.name; //getting the name of the pressed button

            /****AJAX Function*********/
            $.post('/products/delete', {id:id}, function(data) {
                if(data == 1){ //In case if data is deleted

                    var oTable = $('#table_id').dataTable(); // JQuery dataTable function to delete the row from the table
                    oTable.fnDeleteRow( parseInt(name, 10) );// JQuery dataTable function to delete the row from the table
                  //  oTable.fnDraw(true);



               }
                else
                    alert(data);
            });
        });
    });

this.name给出与按下的按钮关联的行的行号,因为我不知道从dataTable动态计算rowIndex的任何方法。

当我计算服务器端的行号并将该号码与按钮相关联时,所以当我删除行数据表时,在客户端重新排列其rowIndex并且服务器不知道任何事情。

解决此问题的任何帮助。

3 个答案:

答案 0 :(得分:8)

试试这个:

$(document).ready(function() {
        $(document).delegate('.but', 'click', function() { 

            var id = this.id; //getting the ID of the pressed button
            var row = $(this).closest("tr").get(0);

            /****AJAX Function*********/
            $.post('/products/delete', {id:id}, function(data) {
                if(data == 1){ //In case if data is deleted

                    var oTable = $('#table_id').dataTable(); // JQuery dataTable function to delete the row from the table
                    oTable.fnDeleteRow(oTable.fnGetPosition(row));// JQuery dataTable function to delete the row from the table
                  //  oTable.fnDraw(true);
               }
                else
                    alert(data);
            });
        });
    });

答案 1 :(得分:2)

// Delete Row from dataTable - START //
    $('body').on('click', 'i.DeleteRow', function() {
          DeletedRow = $(this).parents('tr');
    });

    $('body').on('click', '.btnYES', function(){
        console.log('DeletedRow:', DeletedRow);
        $('#unitsTableDisplay').DataTable().row(DeletedRow).remove().draw();
    })
    // Delete Row from dataTable - END //

答案 2 :(得分:0)

     class   value   min   
0      1       6      4
1      1       4      4
2      1       5      4
3      5       6      2
4      5       2      2
...   
n     225      3      3

在此代码中,您可以找到从适用于我们的项目的DataTable中删除,添加和更新行