javascript - 如何访问 ajax.data 对象进行服务器端处理（jquery DataTables）？

Question

我已经看过https://datatables.net/reference/option/ajax.data和其他关于如何将自定义 HTTP 变量发送到服务器的示例。但我无法理解如何将对象作为参数发送。我希望能够查看 DataTable 作为对象而不是单个参数发送到服务器的所有参数。

我的设置如下：

$(document).ready(function () {
$('#example').DataTable({
    processing: true,
    serverSide: true,
    ajax: {
        "url": '/Browse/GetRecordsAsync',
        "type": 'POST',
        "datatype": "json",
        "data": {
            "sentData": $.ajax.data,
            "search": "asd"
        }
    },
    columns: [
        { "data": "name"},
        { "data": "occupation"},
        { "data": "salary"},
    ],
    });
});

在我的控制器中，我的控制器动作的签名是：

[HTTPPost]
public async Task<ActionResult> GetRecordsAsync(object sentData, int draw, int start, int length, string search)

这是一个简单的实验，可以查看哪些数据正在发送到服务器。我不确定如何获取返回的对象（文档状态 ajax.data 选项发送此信息）以及如何设置方法签名以正确访问该对象。另外，我不确定如何设置方法参数以从https://datatables.net/manual/server-side#Returned-data访问 search[value] 或 order[i][column]

我正在阅读文档，但我仍然不明白如何从我的控制器访问返回的对象或特定参数，例如 search[value]。

标签： javascriptc#ajaxdatatables

Answer 1

我有同样的问题，只能找到这个说对象不公开： https ://datatables.net/forums/discussion/25470

但是，您可以模仿功能，以下是为 DataTables 1.10.18 编写的：

//This function returns the ajax post object datatables generates automatically on refresh
function GetDataTablePost(dt) {
    //Originally Sourced from: https://datatables.net/forums/discussion/21940/how-to-pass-new-post-parameters-on-ajax-reload
    //Modified heavily to make something postable.
    var settings = $(dt).dataTable().fnSettings();

    var obj = {
        //default params
        "draw": settings.iDraw,
        "start": settings._iDisplayStart,
        "length": settings._iDisplayLength
    };
    //columns
    for (var index in settings.aoColumns) {
        obj['columns[' + index + '][data]'] = settings.aoColumns[index].data;
        //Strictly speaking, this should be settings.aoColumns[index].name, however, using the th value because it's more relevant on a server post.
        obj['columns[' + index + '][name]'] = settings.aoColumns[index].sTitle.trim();
        obj['columns[' + index + '][searchable]'] = settings.aoColumns[index].bSearchable;
        obj['columns[' + index + '][orderable]'] = settings.aoColumns[index].bSortable;
        obj['columns[' + index + '][search]'] = null; //TODO: Populate this correctly.
    }
    //sort
    for (var index in settings.aLastSort) {
        obj['order[' + index + '][column]'] = settings.aLastSort[index].col;
        obj['order[' + index + '][dir]'] = settings.aLastSort[index].dir;
    };
    obj['search[value]'] = settings.oPreviousSearch[settings.oPreviousSearch._hungarianMap['search']];
    obj['search[regex]'] = settings.oPreviousSearch[settings.oPreviousSearch._hungarianMap['regex']];
    settings.ajax.data(obj);
    //Not part of the normal object, add the ajax url for convenience.
    obj['url'] = settings.ajax.url;
    return obj;
}

//This function performs a post containing the parameters in obj.
function doPost(postUrl, obj) {
    //Inspired by: https://stackoverflow.com/questions/1350917/send-post-variable-with-javascript
    var submitMe = document.createElement("form");
    submitMe.action = postUrl;
    submitMe.method = "post";
    submitMe.enctype = "multipart/form-data";
    for (var index in obj) {
        var submitMeInput = document.createElement('INPUT');
        submitMeInput.name = index;
        submitMeInput.setAttribute('value', obj[index]);
        submitMe.append(submitMeInput);
    }
    $(submitMe).hide();
    document.body.append(submitMe);
    submitMe.submit();
    document.body.removeChild(submitMe);
}

要使用，我的按钮操作对象是：

action: function (e, dt, node, config) {
    var obj = GetDataTablePost(dt.context[0].oInstance);
    obj.cmd = "Do more stuff!";
    doPost(obj.url, obj);
}

在服务器端，我使用以下方法检索参数：

public ActionResult _PopulateDataTable(string cmd, int draw, int start, int length, Dictionary<string, Dictionary<string, string>> columns, Dictionary<string, Dictionary<string, string>> order, Dictionary<string, string> search) {
  int recordsTotal, recordsFiltered;
  var data = applicationData.RunQuery(start, length, columns[order["0"]["column"]]["data"], order["0"]["dir"], search["value"], out recordsTotal, out recordsFiltered);
  return Json(new { draw = draw, recordsFiltered = recordsFiltered, recordsTotal = recordsTotal, data = data });
}