Question

我正在使用dataTables测试一个新表，我已经让它显示了我想要的数据，所以我现在添加了添加，编辑和删除行的选项。我没有使用编辑器。我想使用jquery，datatables命令和一些帮助：）

我的表格布局如下所示。

<table class='display' id='staff'>
<thead><tr><th>Name</th><th>StaffID</th><th>Department</th></tr></thead>
<tbody>
    <tr id='f6150b00'><td>Rod</td><td>3121</td><td>Physics</td></tr>
    <tr id='0a190b00'><td>Jane</td><td>3122</td><td>Music</td></tr>
    <tr id='621b0b00'><td>Freddy</td><td>3123</td><td>Drama</td></tr>
</tbody>
</table>

表单是从数据库查询生成的，TR ID对每个工作人员都是唯一的。

我用以下内容初始化dataTable：

 oTable = $('#staff').dataTable({
    "bJQueryUI": true, "sPaginationType": "full_numbers",
    "aLengthMenu": [[10, 25, 50], [10, 25, 50]]
});

我使用以下方式将行标记为已选择：

$('#staff').on( 'click', 'tr', function () {
        if ( $(this).hasClass('selected') ) {
            $(this).removeClass('selected');
        }
        else {
            oTable.$('tr.selected').removeClass('selected');
            $(this).addClass('selected');
        }
    } );

我创建了三个按钮，添加，编辑和删除，并使用它们来测试如何与行进行交互。

突出显示一行并单击删除会删除该行。我用的代码是：

var sel = $('#staff tr.selected').attr('id')
    oTable.fnDeleteRow( oTable.$('#' + sel)[0] );

点击编辑有时会修改突出显示的行，有时则不会。我的代码是：

var sel = $('#staff tr.selected').attr('id')
$('#staff').dataTable().fnUpdate('COL1', $('tr#' + sel)[0], 0 );
$('#staff').dataTable().fnUpdate('COL2' , $('tr#' + sel)[0], 1 );
$('#staff').dataTable().fnUpdate('COL3' , $('tr#' + sel)[0], 2 );

在此测试中，EDIT只是将行更改为具有COL1，COL2，COL3值。

点击 ADD 会使用以下内容添加新行：

var addRow = $('#staff').dataTable().fnAddData( ['one', 'two', 'three' ]);
var newRow = $('#staff').dataTable().fnSettings().aoData[addRow[0]].nTr;
newRow.setAttribute('id','new000001');

再次，因为这是一个测试，我预设了值并给出了行的TR和ID为new0000001

如果我尝试删除新添加的行，则不会删除。

我试图弄清楚为什么EDIT有时可以正常工作，而其他时间并没有解决为什么DELETE每次都会在新添加的行上失败。

任何人都可以帮忙吗？

由于

数据表，删除添加行？

0 个答案: