为什么不允许在 jquery 数据表服务器端处理 ajax 中使用成功？答案

【问题标题】：Why not allowed using success in jquery datatable server side processing ajax?为什么不允许在 jquery 数据表服务器端处理 ajax 中使用成功？
【发布时间】：2016-08-15 16:08:48
【问题描述】：

我正在使用 asp.net mvc5 并尝试使用 jquery 数据表插件服务器端处理。服务器端处理的教程显示了从服务器返回结果的格式。但我的项目中的不同之处在于我无法从服务器发送“数据”的类型化数组。我将整个 tbody 作为带有所有 html 标签的字符串发送。我的数据表代码如下。

  var e = t.DataTable({processing: true, 
        serverSide: true,
        info: true,   
        stateSave: true, 
        PaginationType: "full_numbers",
        ajax:{
            "url": '@Url.Action("AjaxGetJsonData","Define",new { tablename= @HttpContext.Current.Request.QueryString["tablename"] })',
            "type": "GET",
            "success": function (result) {
                console.log(result);

                $("#sample_1").find("tbody").html(result.data);
                $("#sample_1_processing").hide();
                Init();
                //var oSettings = $("#sample_1").dataTable().fnSettings();
                //oSettings.iTotalRecords = result.recordsTotal;

            }

        }

ajax的结果如下，

Object {draw: 1, iTotalRecords: 25000, iTotalDisplayRecords: 0, data: Array[1]}

数据是这样的

<tr><td></td><td></td><td></td><td></td></tr>

因为视图对于许多表来说是通用的，并且我应该控制很多情况。因此，我在服务器端使用 StringBuilder。如果我把成功的 ajax 分页元素消失在数据表的底部。为什么不允许在ajax中使用success？我拥有数据表的所有全部功能，有没有办法手动设置像 iTotalRecords 这样的功能？我知道这里不是数据表论坛。对此我很抱歉，但我花了很多时间却找不到解决方案。我想手动处理 ajax 成功的数据表的所有功能。我正在使用最新版本的数据表。

【问题讨论】：

为什么不使用 PartialView 作为数据表？
@Alorika 感谢您的建议。我已经在为表格使用部分视图了。

标签： javascript jquery asp.net-mvc datatables server-side-rendering

【解决方案1】：

我最终解决了我的问题。有一些有趣的东西，但我现在可以使用成功。

var e = t.DataTable({
        processing: true,
        serverSide: true,
        info: true,
        stateSave: true,
        PaginationType: "full_numbers",
        "sAjaxSource": '@Url.Action("AjaxGetJsonData","Define")',
        "fnServerData": function (sSource, aoData, fnCallback) {
            aoData.push({ "name": "tablename", "value": $("#temprory").val() });
            console.log(aoData);
            $.ajax({
                url: sSource,
                type: "POST",
                data: aoData,
                success: function (msg) {
                    fnCallback(msg);
                    console.log(msg);
                    $("#sample_1").find("tbody").html(msg.data);
                    $("#sample_1_processing").hide();
                    Init();
                }
            });
        }

有趣的是，如果你删除 fnCallback(msg)，下面包含分页的数据表部分就会消失。我不知道它到底做了什么，但这解决了我的问题。

【讨论】：

顺便说一下 Init() 与问题无关。这与数据表无关。

【解决方案2】：

jQuery 数据表被编码为在 ajax 中使用成功回调，如果你拦截它，它就会中断。 Source

您也可以使用jQuery ajax dataFilter callback。

$('table[id=entries]').DataTable({
    processing: true,
    serverSide: true,
    ajax: {
        type: 'POST',
        url: 'http://example.com/entries',
        dataFilter: function(response) {
            var json_response = JSON.parse(response);
            if (json_response.recordsTotal) {
                // There're entries;
            }else{
                // There're no entries;
            }
            return response;
        },
        error: function (xhr) {
            console.error(xhr.responseJSON);
        }
    }
});

注意：dataFilter回调中返回字符串，而不是json。

【讨论】：