如何重新初始化jquery Datatable

如何重新初始化jQuery数据表？ 我甚至试图删除表元素。 那个表还在显示。 我的代码是这样的：

function removeExistingDataTableReference(tableid) { if(oTable !=null) { oTable.fnDestroy(); } if(document.getElementById(tableid)){ document.getElementById(tableid).innerHTML=""; } oTable=null; try { if(oTable !=null) { //oTable.fnDestroy(); alert("error in fndestroy"); } oTable=null; if(document.getElementById(tableid)){ document.getElementById(tableid).innerHTML=""; } if(document.getElementById("FTable")) { removeElement(document.getElementById("FTable")); } } catch(e) { alert("Error happend:"+e.message); } } function removeElement(element) { try { var elem = document.getElementById('FTable'); elem.parentNode.removeChild(elem); //ert(element.parentNode.id); //element.parentNode.removeChild(element); alert("removed"); return true; } catch(e) { alert(e.message); } return false; } 

我怎样才能做到这一点？ 搜索按钮后单击表已加载。 同样，当我使用其他搜索参数进行搜索时，表格应该加载新数据。 那没有发生。 怎么解决？

表初始化如下：

 function createDataTable() { try { oTable = $('#FTable').dataTable( { "bDestroy":true, "bJQueryUI": true, "sScrollX": "100%", "sScrollXInner": tablewidth+"px", "bScrollCollapse": true, "bSort":false, "iDisplayLength" : 50, "sPaginationType" : "full_numbers", "aLengthMenu": [[10, 18, 50, -1], [10, 18, 50, "All"]] } ); new FixedColumns( oTable, { "iLeftColumns": 1, "iRightColumns": 1 } ); } catch (e) { alert(e.message); } } 

Answer 1

您可以通过清除数据表然后使用fnAddData()添加元素来重新初始化数据fnAddData() 。

首先检查dataTable是否存在。 函数fnClearTable()将清除表中的数据。

在代码中， dataTable是results表变量， results是表的id 。

 if(typeof dataTable === 'undefined'){ dataTable = $('#results').dataTable({ "aLengthMenu": [ [25, 50, 100, 200], [25, 50, 100, 200] ], "iDisplayLength" : 25, "sPaginationType": "full_numbers", }); }else dataTable.fnClearTable(); 

然后再使用fnAddData添加数据。

 dataTable.fnAddData( [key, assignee, summary, status, days]); 

Answer 2

您可以使用fnReloadAjax

http://datatables.net/forums/discussion/256/fnreloadajax/p1

 oTable = $('#FTable').dataTable( { "bDestroy":true, "bJQueryUI": true, "sScrollX": "100%", "sScrollXInner": tablewidth+"px", "bScrollCollapse": true, "bSort":false, "iDisplayLength" : 50, "sPaginationType" : "full_numbers", "aLengthMenu": [[10, 18, 50, -1], [10, 18, 50, "All"]] } ); function reinit(){ oTable.fnReloadAjax( 'media/examples_support/json_source2.txt' ); }