jquery datatables：点击按钮后更新表格单元格

我们的页面中有一个表格，最后有几行和一个自定义切换按钮。 该表是通过页面中的html加载的，而不是通过json加载的。

现在，最后的togglebutton发布到服务并在数据库中设置该记录的跟随状态。

但是，它还应该更新该行中的另一个单元格。 但是我确定我不应该通过jquery手动但通过数据表来做到这一点？

$('#tblFollow').dataTable({ sDom: "t", aoColumns: [ null, null, null, { bSortable: false } ] }); $('#tblFollow').on('click', 'a.follow', function(e){ $(this).toggleClass('active'); // updating column 'following' here... // but this only changes visually, and not the inner datatables data used for sorting var followingCell = $(this).parents('td').prev(); var txt = followingCell.text() == "1" ? "0" : "1"; followingCell.text(txt); return false; }); 

手动示例：现在我有一个示例，我手动更改字段，但这只是可视的，数据表仍然使用其内部数据进行排序。 所以我正在寻找一种更好的方法

Answer 1

这是一个可能的解决方案：

除了代码之外，您还应该更新数据表数据，如下所示

 var rowIndex = table.fnGetPosition( $(this).closest('tr')[0] ); var aData = table.fnGetData( rowIndex ); aData[2] = txt; //third column 

这里是jsfiddle

更好的解决方案是使用fnUpdate更新数据并同时显示

这里是jsfiddle

 // update column following here... var followingCell = $(this).parents('td').prev(); var txt = followingCell.text() == "1" ? "0" : "1"; var rowIndex = table.fnGetPosition( $(this).closest('tr')[0] ); table.fnUpdate( txt, rowIndex , 2); 

---

也代替我们

 var followingCell = $(this).parents('td').prev(); var txt = followingCell.text() == "1" ? "0" : "1"; 

使用

 var aData = table.fnGetData( rowIndex ); aData[2] //use it to check if the value is 0 or 1