DataTables 在初始化时不发送 ajax 请求答案

【问题标题】：DataTables do not send ajax request at the initializationDataTables 在初始化时不发送 ajax 请求
【发布时间】：2016-12-09 06:08:29
【问题描述】：

如何使用dataTables实例化表格不加载数据（服务器模式），然后点击按钮加载数据。如果初始化时serverSide设置为true，表格将自动发送ajax请求，然后渲染数据，这不是我想要的！:(

【问题讨论】：

显示一些代码。
不要使用数据表 ajax，使用与按钮关联的单独的 ajax 来关闭它
您是否在按钮事件上编写了数据表初始化代码？我
@HaseenaPA 我只希望数据表在初始化时不发送 ajax 请求，我认为它可能有一个选项来完成。但我在link中找不到@
stackoverflow.com/questions/40828790/…

标签： javascript datatables

【解决方案1】：

您应该在初始化时在 DataTables 参数中使用 "iDeferLoading" : 0：

var table =  $("#table").dataTable({
  "bProcessing": true,
  "bServerSide": true,
  "iDeferLoading": 0,
  "sAjaxSource": service_url,
  "sServerMethod": "POST",
  ...
  ...

（或 "deferLoading":0 用于较新的 DataTables 版本，1.10 及更高版本），然后将事件添加到您的按钮：

$("#button").on("click", function (event) {
   $('#table').dataTable().fnDraw();
});

https://datatables.net/examples/server_side/defer_loading.html

【讨论】：

【解决方案2】：

在类似的情况下，我就是这样做的。

         <script>
                $(function ($) {
                    $("#tbl").DataTable({columns:[{data:"id"}, {data:"text"}], dom: "tB", buttons: [{ text: "Load Me", action: function (e, dt, node, config) { loadme(e, dt, node, config); } }] });
                }
                );

                // // parameters are passed from the datatable button event handler
                function loadme(e, dt, node, config) {
                    parms = JSON.stringify({ parm1: "one", parm2: "two" });

                    $.ajax({
                        // my test web server that returns an array of {id:"code field", text:"country namee"}
                        url: "WebService1.asmx/GetAList",
                        data: JSON.stringify({ s: parms }),
                        type: 'post',
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        // this is just away of passing arguments to the success handler
                        context:{dt:dt, node:node},

                        success: function (data, status) {

                            var contries = JSON.parse(data.d);
                            for (var i = 0; i < contries.length; i++){
                                this.dt.row.add(contries[i], "id", "text");
                                this.dt.draw();
                            }
                        },
                        error: function (one, two) {
                            debugger;
                        }
                    });

                }


            </script>
        </head>
        <body>
            <div style="width:500px">
                <table id="tbl">
                    <thead>
                        <tr>
                            <th>Code</th>
                            <th>Contru</th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                    <tfoot></tfoot>
                </table>
            </div>
        </body>

【讨论】：

你的代码并没有自动附加DataTables的Sent Parameters，非常感谢，那我应该想想怎么把DataTables拼接到Sent parameters里面。@Bindrid
所以，如果我理解正确的话，在获取数据后，您希望用于获取数据的参数显示为数据的一部分。在数据集的顶部还是底部？

【解决方案3】：

看了半天源码，终于找到了解决办法。首先，我需要一个名为 firstAjax 的自定义参数并将其设置为 false。像这样：

$("#example").DataTable({
    serverSide: true,
    ajax: {
        url: 'your url'
    },
    firstAjax: false
});

然后我换了

_fnReDraw (settings);  //in datatables.js line 4717

到

if (settings.oInit.firstAjax) {
         _ fnReDraw (settings);
     }

如果是压缩的js文件（datatables.min.js），应该找到_fnReDraw函数对应的别名。

【讨论】：

非常抱歉，仔细阅读文档后发现，Datatables中有一个配置项来控制Ajax请求在初始化表时发生，这个选项是'deferLoading'。

【解决方案4】：

我找到了解决方案，在这样的初始化中，使用“oLanguage”：

$('.table').dataTable({
  oLanguage: {
     sUrl: ""
  }
});

【讨论】：

【解决方案5】：

用ajax初始化datatables后，用这个简单的行来调用ajax获取数据：

$('#table').DataTable().ajax.reload();

此代码可能不适用于旧版本的 datatables。

下载最新版本：https://datatables.net/download

【讨论】：