typescript 带参数的数据表 ajax.reload()
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/42412845/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
DataTables ajax.reload() with parameters
提问by SrAxi
I am using DataTables serverSidein an Angular2 project.
我在 Angular2 项目中使用 DataTables serverSide。
I am trying to reload the table after making changes, and those changes I want to pass them as parameters in POST via AJAX.
我试图在进行更改后重新加载表，而这些更改我想通过 AJAX 在 POST 中将它们作为参数传递。
The thing is that DataTables is always getting the optionsobject from the initialization, and not an updated version with the new parameters.
问题是 DataTables 总是options从初始化中获取对象，而不是带有新参数的更新版本。
So, what I needis, to use ajax.reload()passing a new set of parameters.
所以，我需要的是，使用ajax.reload()传递一组新的参数。
This is my current function:
这是我目前的功能：
filterData(tableParams) {
console.log('reloading DT. tableparams received are: ' + JSON.stringify(tableParams));
let element = $(this.el.nativeElement.children[0]);
let table = element.find('table.dataTable');
table.DataTable().ajax.reload();
}
At the moment, as you can see, I'm not using tableParams, this is because I wanted to show a clean version of my function, I tried many things and none of them worked.
目前，正如您所看到的，我没有使用tableParams，这是因为我想展示我的函数的干净版本，我尝试了很多东西，但没有一个起作用。
DataTables always gets the initial optionsobject, with the initial parameters.
DataTables 总是获取options带有初始参数的初始对象。
This is one of my desperate attempts:
这是我绝望的尝试之一：
filterData(tableParams) {
let element = $(this.el.nativeElement.children[0]);
let table = element.find('table.dataTable');
table.DataTable({
ajax: {
url: this.jsonApiService.buildURL('/test_getUsers.php'),
type: 'POST',
data: tableParams,
},
}).ajax.reload();
}
Some help would be much appreciated. If you need further explanations on how the DataTable is created, or more code snippets let me know. But I think that the issue is just with the ajax.reload()function, being able to send updated parameters will solve the issue.
一些帮助将不胜感激。如果您需要有关如何创建 DataTable 的进一步说明，或者更多代码片段，请告诉我。但我认为问题仅在于ajax.reload()函数，能够发送更新的参数将解决问题。
Thanks very much!
非常感谢！
Edit 1
编辑 1
This is my init optionsobject:
这是我的初始化options对象：
let data = {
email: true,
test: 'init',
};
this.options = {
dom: 'Bfrtip',
processing: true,
serverSide: true,
pageLength: 20,
searchDelay: 1200,
ajax: {
url: this.jsonApiService.buildURL('/test_getUsers.php'),
type: 'POST',
data: data,
},
columns: [
{data: 'userId'},
{data: 'userCode'},
{data: 'userName'},
{data: 'userRole'},
{data: 'userEmail'},
],
};
And these are the parameters that DataTables is sending:
这些是 DataTables 发送的参数：
(Among other DataTables parameters)
（在其他 DataTables 参数中）
When I call ajax.reload(), no matter the things I have tried, I end up sending these same parameters, therefore, sending the init parameters.
当我打电话时ajax.reload()，无论我尝试过什么，我最终都会发送这些相同的参数，因此，发送 init 参数。
回答by SrAxi
I finally got the solution, the problem was that I was too focused on achieving my goal through DataTable().ajax.reload(). I wanted to pass the parameters through there in one way or another, and that was incorrect.
我终于得到了解决方案，问题是我太专注于通过DataTable().ajax.reload(). 我想以一种或另一种方式通过那里传递参数，这是不正确的。
I had to change the construction of the optionsobject.
As you saw earlier, I was assigning my custom parametersto the optionsobject like this:
我不得不改变options对象的构造。正如您前面看到的，我被分配我的自定义参数到options这样的对象：
ajax: {
url: this.jsonApiService.buildURL('/test_getUsers.php'),
type: 'POST',
data: this.params,
}
Where data: this.paramswould get the data from somewhere, in my case, I had 2 listeners, one for initand another for updatingthat change this.paramsvalue. This, instead of a listener could be an onChange(), but the point is that the parameters change at runtime.
哪里data: this.params可以从某个地方获取数据，就我而言，我有 2 个侦听器，一个用于init，另一个用于更新更改this.params值。这，而不是侦听器可以是onChange()，但关键是参数在运行时会发生变化。
So I simply had to put this into a function, and merge DataTable's parameters to my own parameters.
所以我只需要把它放到一个函数中，并将 DataTable 的参数合并到我自己的参数中。
This is my solution:
这是我的解决方案：
data: function (d) {
Object.assign(d, myClass.params);
return d;
}
With this optionsobject, when I have to refresh the DataTable sending new parameters to the server, I simply call ajax.reload(). DataTables will get the optionsobject with the latest dataand reload itself.
有了这个options对象，当我必须刷新 DataTable 向服务器发送新参数时，我只需调用ajax.reload(). DataTables 将获取options最新的对象data并重新加载自身。
I really hope this can help someone! Good work and happy coding!
我真的希望这可以帮助某人！干得好，编码愉快！
回答by Akmal
In some cases you may want to change ajax url at runtime or apply any additional query parameters.
在某些情况下，您可能希望在运行时更改 ajax url 或应用任何其他查询参数。
So you can do like this:
所以你可以这样做：
var dataTable = $('#example').DataTable({...});
dataTable.ajax.url('/new-ajax-url?someParam=1').load();
It works with version v1.10.16 of the library.
它适用于库的 v1.10.16 版本。
回答by Ilker Burak
$('#example').dataTable({
"ajax": {
"url": "data.json",
"data": function (d) {
d.extra_search = $('#extra').val();
}
}
});
then simply call:
然后只需调用：
table.ajax.reload();
