AJAX：jQuery DataTables（服务器端）没有收到任何请求（GET 或 POST）数据

Question

我正在尝试打印一个简单的数据表，当我在任何列（或页面右上角的“整个表”）上使用搜索/过滤器时，我想更新它。当我单击列标题（排序）时，请求通过（尽管页面仍然无限期地显示“处理”）。当我在过滤器中输入任何内容时，它会无限期地显示“正在处理”，但没有请求传递给服务器。

以下是脚本：

client.php

<!-- jQuery and DataTables JS files, including CSS, are included here -->
<table id="employee-table" class="table-striped">
<thead>
<tr>
    <th>First</th>
    <th>Last</th>
    <th>DOB</th>
</tr>
<tr>
    <th>First</th>
    <th>Last</th>
    <th>DOB</th>
</tr>
</thead>
</table>
<script type="text/javascript">
jQuery(document).ready(function() {

    jQuery("#employee-table").dataTable({
        processing: true,
        serverSide: true,
        ajax: {
            url: "datatable.php",
            type: 'POST'
        }
    }).columnFilter({
        sPlaceHolder: "head:after",
        aoColumns: [
            { type: "text" },
            { type: "text" },
            { type: "text" }
        ]
    });
});
</script>

datatable.php

file_put_contents("debug.txt", $_REQUEST);

echo '{
"draw": 1,
"recordsTotal": 3,
"recordsFiltered": 3,
"data": [
    [
        "Angelica",
        "Ramos",
        "1986-01-01"
    ],
    [
        "Ashton",
        "Cox",
        "1987-01-01"
    ],
    [
        "Test",
        "Third",
        "1989-01-01"
    ]
]
}';

如您所见，我在服务器端脚本上所做的只是将所有请求的数据打印到一个文件中，以便我可以检查它。问题是，无论我在过滤框中输入什么，都没有请求数据通过。这是一个视觉效果：

这是 debug.txt 的输出。请注意，这是在初始加载 client.php 时加载到文件中的内容，当您在任何搜索框中键入任何内容时，它不会更改：

Array
(
[draw] => 1
[columns] => Array
    (
        [0] => Array
            (
                [data] => 0
                [name] => 
                [searchable] => true
                [orderable] => true
                [search] => Array
                    (
                        [value] => 
                        [regex] => false
                    )

            )

        [1] => Array
            (
                [data] => 1
                [name] => 
                [searchable] => true
                [orderable] => true
                [search] => Array
                    (
                        [value] => 
                        [regex] => false
                    )

            )

        [2] => Array
            (
                [data] => 2
                [name] => 
                [searchable] => true
                [orderable] => true
                [search] => Array
                    (
                        [value] => 
                        [regex] => false
                    )

            )

    )

[order] => Array
    (
        [0] => Array
            (
                [column] => 0
                [dir] => asc
            )

    )

[start] => 0
[length] => 10
[search] => Array
    (
        [value] => 
        [regex] => false
    )

)

为了让过滤器正常工作，我缺少什么？我假设我的客户端 DataTables JavaScript 配置错误，但我不知道如何。我的搜索似乎只是提取了“旧版”DataTables 解决方案，而不是他们拥有的简化的新版本。

非常感谢任何帮助！

Answer 1

尝试如下：

client.php

$(document).ready(function() {
    var oTable = $('#employee-table').dataTable({
            "bJQueryUI": true,
            "bProcessing": true,
            "bServerSide": true,
            "bRedraw": true,
            "sAjaxSource": "datatable.php",
            "aoColumns": [
                {"mDataProp": "first"},
                {"mDataProp": "last"},
                {"mDataProp": "dob"},
            ],
            "aaSorting": [[0, "asc"]]
    });
});

datatable.php

请检查以下链接并在datatable提供的代码中配置您的数据库设置。

Server Side Code