Question

我有一个数据集，它通过Ajax检索到dataTable中，并且有一个时间延迟，这意味着用户可以在加载之前执行操作。我必须一次加载这个数据集，所以这次我不能使用服务器端处理来提供服务。

我正在使用dataTables按钮下载xls，我将在数据集到达之前禁用，然后重新启用。如果我没有这样做，用户可以在ajax请求完成之前下载空的电子表格。因此，对于按钮，我将其编码为：

buttons: [
        {
            extend: 'excel',
            text: '<i class="fa fa-file-excel-o"></i>',
            titleAttr: 'Download to Excel',
            enabled: false
        },
    ],

然后：

table.on( 'draw.dt', function () {
    table.buttons().enable();
});

我需要对可订购的列执行相同的操作，因为如果在加载数据之前单击可订购的列，则显示的消息会从“正在加载”列中更改。到目前为止没有数据可用表格＆＃39; （可以理解），但它不是一个很棒的用户体验。

我将每列设置为orderable: false，如下所示：

columns: [
        {
            data: 'myData', 
            orderable: false, // all columns are set to false like this
        },

这样可行，它设置了所有列，因此无法对它们进行排序。我无法做的是在数据加载后将它们全部订购。

我希望可能的是这样的事情，但是我尝试的它/什么都不会起作用：

table.on( 'draw.dt', function () {
    table.columns().orderable().enable();
});

有什么想法吗？如果我必须单独启用每个列，那也没关系，我也找不到办法。

提前致谢。

Answer 1

在初始化期间设置orderable: false，然后在table.columns().orderable().enable();之后更改它的原因不起作用的原因是orderable: false是初始化选项。由于DataTables的工作方式，在初始化完成后无法更改初始化选项。这意味着您需要在加载数据时找到一些禁用排序的方法。

就个人而言，如果这只是初始加载，我只会隐藏表style="display: none;"，直到您可以调用initComplete回调，然后只需调用$(...).show();。如果您不想隐藏整个表格，可以有选择地隐藏标题（可能是$.("#table thead").hide();），并在加载后显示它们。

对于我正在开发的网站，我们有类似的情况，一次加载大约50k行。我使用$.blockUI()在执行ajax调用时在表上放置一个自定义弹出窗口阻止程序。我认为这个解决方案具有最佳的UI体验。您可以使用$.blockUI()在表格上有选择地应用阻止模式，并使用自定义加载消息。

dataTables - 如何在＆＃39; draw.dt＆＃39;

1 个答案: