Question

目前我有一个这样的数据表，

当用户单击任何项目时，我正在打开bootstrap 4模态，它将打开

但是当datatable处于模式时，我没有获得搜索和分页功能。这是我的代码

以下是HTML代码：

<!-- Modal body -->
<div class="modal-body">
    <div class="card">
        <div class="card-header">
            <h5 class="card-title float-left">List of items</h5>
        </div>
        <div class="card-body row">
            <div class="col-md-12">
                <div class="table-responsive">
                    <table class="table table-bordered display" id="datatables">
                        <thead>
                            <tr>
                                <th scope="col">#</th>
                                <th scope="col">Item Name</th>
                                <th scope="col">Item Model</th>
                                <th scope="col">Item Year</th>
                                <th scope="col">Item Condition</th>
                                <th scope="col">Item Price</th>
                                <th scope="col">Status</th>
                            </tr>
                        </thead>
                        <tbody id="showEmployeesReportItems">
                            <!-- List of Items -->
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

这是我的jquery代码：

$('#datatables').DataTable().destroy();
$('#showEmployeesReportItems').html(html);
$('#datatables').DataTable();

如何获取模态数据表中的分页和搜索功能？

Answer 1

有一个解决方案，将id =“ datatables”引导程序模式主体id更改为2、3或任何数字，并在此处将其更改为$（'＃datatables2'）。DataTable（）;现在，jQuery数据表也可以在引导模态下正常工作。

Bootstrap 4模式的jQuery Datatable问题

1 个答案: