Javascript 如何访问ajax.data对象进行服务器端处理(jquerydatatables)?
我已经看到了一些关于如何向服务器发送自定义HTTP变量的示例和其他示例。但是我很难理解如何将对象作为参数发送。我希望能够查看DataTable作为对象发送给服务器的所有参数,而不是单个参数 我的设置如下:Javascript 如何访问ajax.data对象进行服务器端处理(jquerydatatables)?,javascript,c#,ajax,datatables,Javascript,C#,Ajax,Datatables,我已经看到了一些关于如何向服务器发送自定义HTTP变量的示例和其他示例。但是我很难理解如何将对象作为参数发送。我希望能够查看DataTable作为对象发送给服务器的所有参数,而不是单个参数 我的设置如下: $(document).ready(function () { $('#example').DataTable({ processing: true, serverSide: true, ajax: { "url": '/Browse/GetRecord
$(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)
[HTTPPost]
公共异步任务
我正在阅读文档,但仍然不知道如何从我的控制器访问返回的对象或特定参数,如search[value]。我也有同样的问题,只能找到表示该对象不是公共的:
但是,您可以模拟功能,下面是为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 });
}
public ActionResult\u PopulateDataTable(字符串cmd、int-draw、int-start、int-length、字典列、字典顺序、字典搜索){
int recordsTotal,记录过滤;
var data=applicationData.RunQuery(开始、长度、列[顺序[“0”][“列”][“数据”]、顺序[“0”][“目录”]、搜索[“值”]、输出记录总计、输出记录过滤);
返回Json(新的{draw=draw,recordsFiltered=recordsFiltered,recordsTotal=recordsTotal,data=data});
}
当您将服务器端选项设置为true时,我建议您在ajax中添加“contentType:'application/json',并且ajax中的数据选项应该是带有参数data的函数
$("#example").DataTable({
autoWidth: true,
processing: true,
serverSide: true,
ajax: {
url: "xxx",
type: "post",
contentType: "application/json",
data: function (d) {
// d.search = $("#search").val();
console.log(d); // this a your need
return JSON.stringify(d);
}
}
});
响应对象具有以下四个属性:
- draw: From ajax.data.draw
- data: The data that table need to display
- recordsFiltered: The number after the filter
- recordsTotal: The number before the filter