Question

现在我正在为搜索结果创建一个数据表。所以会有如下搜索表单：

<form id="">
  Colour: <input id="colour" type="text" />
          <a href="#" class="btn submit_search">Submit</a>
</form>

因此，当用户使用此表单提交此表单时，列表将显示在数据表中。下面是我的代码调用数据库，并将结果显示在数据表中：

var myTable = $('#myTable').DataTable();

$('.submit_search').on('click', function(){
    $.ajax({
        type: "POST",
        url: myURL,
        data: myData,
        dataType: "json",
        success: function (data) {
            // here the search working great
            // there is total of 100 data from the search, but I only pass 25 (TOP 25)
            //
            var json = $.parseJSON(data);
            data.draw = parseInt(json.draw);
            data.recordsTotal = parseInt(json.recordsTotal); // total 100 pass here
            data.recordsFiltered = parseInt(json.recordsFiltered); // total 100 pass here
            data.data = json.searchData;

            myTable.clear().draw();
            myTable.rows.add(data.data).draw();
        }
    });
});

从上面的代码中，我的所有25个数据都已在表格中正确显示。除了我的分页不正确。据推测，表格下方会显示4页，但只有1页显示。

如何使用服务器端实现此目的。或者您有任何其他建议可以做到这一点。请帮我。感谢

Answer 1

初始化DataTable时，您可能想尝试设置一些选项。有关详细信息，请参阅有关分页的DataTables文档。 https://datatables.net/examples/basic_init/alt_pagination.html

$(document).ready(function() {
    $('#example').DataTable( {
        "pagingType": "full_numbers"
    } );
} );

如果这没有帮助，请尝试包括“＆＃39; dom＆＃39;初始化中的选项。如果您使用其中一个样式集成选项（如Bootstrap，Foundation或jQuery UI），则它们将更改此参数的默认值。 https://datatables.net/reference/option/dom

    $('#example').dataTable( {
        dom: 'lfrtip'
    } );

Datatables插件：绘制onclick后分页不正确

1 个答案: