如何在 Jquery 中重新初始化 DataTable答案

【问题标题】：How to re-initialize DataTable in Jquery如何在 Jquery 中重新初始化 DataTable
【发布时间】：2015-04-29 13:23:40
【问题描述】：

我有一个要求，我必须存储 DataTable 的状态，例如 'pagination'、'sorting'、'search' 等。为此，我有将 'bStateSave' 属性设置为 'True' 并且效果很好。我知道'bStateSave' 以Cookie 的形式保存状态。现在我有另一个要求，我必须重置 DataTable 并在用户登录的情况下重新初始化它。

外汇：

if (sessionUserLogin == 'True') {
       $('#myTableId').dataTable({ "bStateSave": false, "bDestroy": true});            
       $('#myTableId').dataTable({ "bStateSave": true });
  }
   else {
         $("#myTableId").dataTable({ "bStateSave": true });
  }

根据上面的例子，“sessionUserLogin”告诉用户是否登录系统，如果这个标志（sessionUserLogin）设置为True，我想销毁之前的状态并再次初始化表，以便它可以继续保存状态。其他条件用于处理系统中的其他回发，因为在用户登录后，即使在回发像任何 DropDown 更改或保存记录。

我上面的代码在用户登录时工作正常，我可以清除表的状态，但我无法再次初始化表的状态。

我已经通过了这个URL。但还是找不到解决办法。

请帮忙。提前致谢。

【问题讨论】：

datatables.net/forums/discussion/8154/…
我已经查看了这个链接，但是在这个链接中使用了“iCookieDuration”属性来设置cookie的过期时间，但根据我的要求，我想在用户登录的情况下删除cookie并且想要再次重置。
用户“bennybenben”的第 (7) 个回复显示了一个解决方案，不会弄乱 cookie。
是的，我查看了“bennybenben”发布的代码，但我无法理解代码，请您发布答案并帮助我使用“bennybenben”发布的代码实现我的代码.谢谢。
查看state...函数的文档，例如stateLoadCallback。这些应该有助于完成您的请求 - 至少如果您使用的是最新版本的 dataTables。

标签： c# jquery asp.net datatable

【解决方案1】：

你可以尝试使用它的destroy方法如下

var table = $('#myTable').DataTable();
if (sessionUserLogin == 'True') {
        table.destroy();
        $('#YourTableID').empty();
        $('#YourTableID').DataTable( {
             "bStateSave": true
        });
  }
   else {
         $("#YourTableID").DataTable({ "bStateSave": true });
  }

编辑

var table = $('#myTable').DataTable();
if (sessionUserLogin == 'True') {
        table.destroy();
        $('#YourTableID').empty();
        table = $('#YourTableID').DataTable( {
             "bStateSave": true
        });
  }
   else {
         table = $('#YourTableID').DataTable( {
             "bStateSave": true
        });
  }

【讨论】：

首先我想确认“#myTable”=“#YourTableID”如果是，那么它会弹出“DataTables 警告（表 id = 'myTableId'）：无法重新初始化 DataTable。”它也不能按照我的要求工作。
是的！是同一个身份证！！我会编辑我的答案！检查并告诉我！！ bdw 你用的是什么版本的dataTable？？
我使用了您编辑的答案，现在当用户登录时，状态很清楚意味着我能够看到默认状态，如分页：10 虽然它扰乱了我的表格宽度，但没关系，我会处理它。但是现在，当我将分页从默认值更改为 10 到 25 并执行任何回发（例如下拉更改）时，代码将在代码的 else 条件下移动，并且现在无法维持状态。我们错过了什么吗？
我正在使用版本：1.9.4 的数据表。
而不是bStateSave 尝试使用stateSave: true 并告诉我！！可能是它现在不保存状态！

【解决方案2】：

最后我可以通过使用下面的代码来解决这个问题，您可以将常用功能放在条件之外：

if (sessionUserLogin == 'True') {
                    function save_dt_view(oSettings, oData) {
                        localStorage.setItem('DataTables_' + window.location.pathname, JSON.stringify(oData));
                    }
                    function load_dt_view(oSettings) {
                        return JSON.parse(localStorage.getItem('DataTables_' + window.location.pathname));
                    }
                    function reset_dt_view() {
                        localStorage.removeItem('DataTables_' + window.location.pathname);
                    }
                    reset_dt_view();
                    $('#myTableId').dataTable({
                        "bStateSave": true,
                        "fnStateSave": function (oSettings, oData) { save_dt_view(oSettings, oData); },
                        "fnStateLoad": function (oSettings) { return load_dt_view(oSettings); }
                    });
                }
                else {
                    function save_dt_view(oSettings, oData) {
                        localStorage.setItem('DataTables_' + window.location.pathname, JSON.stringify(oData));
                    }
                    function load_dt_view(oSettings) {
                        return JSON.parse(localStorage.getItem('DataTables_' + window.location.pathname));
                    }
                    function reset_dt_view() {
                        localStorage.removeItem('DataTables_' + window.location.pathname);
                    }
                    $('#myTableId').dataTable({
                        "bStateSave": true,
                        "fnStateSave": function (oSettings, oData) { save_dt_view(oSettings, oData); },
                        "fnStateLoad": function (oSettings) { return load_dt_view(oSettings); }
                    });
                }

【讨论】：