使用scrollX和Bootstrap模式的jQuery Datatable问题

Question

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

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

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

但没有发生任何事。非常感谢任何帮助。

Answer 1

如果有人和我有同样的问题，我通过在'shown.bs.modal'上调用ajax来解决这个问题。我实际上做的是在它可见之前创建表，这样我的问题就出现了。现在，我打开模态，然后我初始化数据表。 此外，我不得不使用'destroy'：这是真的。例如，这是我的简化代码：

$('#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
    });
});