scrollX 和 Bootstrap 模式的 jQuery Datatable 问题

【问题标题】：jQuery Datatable issue with scrollX and Bootstrap modalscrollX 和 Bootstrap 模式的 jQuery Datatable 问题
【发布时间】：2017-08-03 03:40:10
【问题描述】：

在我的应用程序中，我正在打开一个包含 jQuery 数据表的模式，并且我正在尝试使用 scrollX 选项，但我有以下输出：

我在 jQuery 文档上看到了如何使用 Bootstrap 选项卡来解决这个问题，但在 modal 上没有。如果您需要我的项目中的任何内容，我会更新问题。我试过了

$('#vendorsModalTable').on('draw.dt', function () {
    $('#vendorsModalTable').DataTable().scroller.measure();
});

但什么也没发生。非常感谢任何帮助。

【问题讨论】：

标签： javascript jquery asp.net-mvc-5 datatables bootstrap-modal

【解决方案1】：

如果有人和我有同样的问题，我通过对“shown.bs.modal”进行 ajax 调用来解决这个问题。我实际上在做的是在表格可见之前创建表格，所以这是我的问题。现在，我打开模式，然后才初始化数据表。此外，我必须使用 'destroy': true 才能正常工作。例如，这是我的简化代码：

$('#assignVendorModal').on('shown.bs.modal',function(){
    tableModal = $("#vendorsModalTable").DataTable({
    ajax:{
        url:[my_url],
        dataSrc:function(data){
            //Do something maybe with the data...
        }
    },
    "initComplete":function(settings,json){
        //When table is initialized...
    },
    columns:[
        //columns data mapping
    ],
    "scrollX":true,
    "destroy":true
    });
});

【讨论】：