DataTable中的响应表

Question

我的页面如下所示：

我想在页面太小时添加scrollX，所以我必须添加一行 scrollX: true

当我添加页面时看起来像这样：

DataPicker位于行后面，列的行不在同一行，但是scrollX工作（看图片）。当我在输入和ajax加载数据中写入列的行工作正常但数据删除仍然不起作用。我该如何修理？

代码_table.blade.php

<table class="table table-striped table-bordered" id="policies-table" style="width: 100%;">
    <thead>
        <tr>
            <th>Numer polisy</th>
            <th>Produkt</th>
            <th>Data wystawienia</th>
            <th>Wartość</th>
            <th>Składka</th>
            <th>Wystawiający</th>
            <th>Akcje</th>
        </tr>
    </thead>
</table>

Ajax加载：

$('#policies-table').DataTable({
    ajax: {url:"url",
    type: "POST",
    'headers': {'X-CSRF-TOKEN': '{{ csrf_token() }}'}},
    processing: true,
    serverSide: true,
    autoWidth: true,
    scrollX: true,
    scrollCollapse: true,
    jQueryUI: true,
    order: [[ 2, "desc" ]],
    ........
});

Answer 1

试试这个$('#policies-table').DataTable({responsive: true} );

或者如果您使用的是bootstrap，则无法尝试此

<div class='table-responsive'>
    <table class='your classes'>
    </table>
</div>