如何刷新DataTables [英] How to refresh DataTables
问题描述
我正在使用DataTables插件来使我的表互动。
I am using DataTables plugin to make my table interactive.
该页由PHP在页面上回显。
The table is echo'd by PHP on the page.
当我向DB添加记录时,我使用jQuery load()加载表,但是这会打破DataTable。
When I add a record to the DB I am loading the table using jQuery load() but this breaks DataTables.
如何更新表而仍然保持DataTable完整?
How can I update the table while still keeping DataTables Intact?
注意:我使用DOM作为数据源,而不是服务器端处理。
Note: I am using DOM as the data source and not server side processing.
推荐答案
如果对整个表进行完全重新加载,请将初始化的数据表初始化代码封装在一个函数中。在页面加载时调用该功能。当用ajax完全替换表时,您可能应该删除由plugin创建的表parent div作为所创建的所有非表DOm元素的包装器。如果表ID =example,则包装器id =example_wrapper。
If doing a complete reload of the whole table, wrap your initial datatables initialization code in a function. Call that function on page load. When replacing the table completely with ajax you likely should remove the table parent div that is created by plugin as a wrapper for all the non table DOm elements it creates. If table ID="example" , wrapper id="example_wrapper".
这里有足够的代码可能会让你很顺利。有更简单的方法只能更新行,但是由于请求是一个完整的表重新加载,我遵循
Here's enough code will likely get you well on your way. There are easy ways to only update rows but since request is for a complete table reload I've followed that
function initDataTables(){
$('#myTable').datatables({/* put all current options here*/})
}
/* within ready event of pageload */
$(function(){
initDataTables();
/* all other page load code*/
});
/* use $.get to reload table */
$.get( tableUpdateUrl, data, function( returnData){
$('#myTable').parent().replaceWith(returnData);
/* re-initalize plugin*/
initDataTables();
});
这篇关于如何刷新DataTables的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!