我有jQuery DataTable
function loadTable() {
var table = $('#example').DataTable({
"processing": true,
"serverSide": true,
"searching": false,
"bLengthChange": false,
"ajax": {
"url": "/updateWithParams",
"type": "POST",
"data": function (d) {
return $('#formFilter').serializeArray();
}
},
............
}
并将其命名为
$(document).ready(function () {
loadTable();
});
但是加载后我可以在按钮上调用此方法(更改表单gata和重载表)但是我收到错误 - 无法重新初始化dataTable ..... 我该如何重新加载数据表?
编辑:
$(document).ready(function () {
// connect();
setDatesFilters();
loadTable();
});
function setDatesFilters() {
var day = start.getDate();
var month = start.getMonth() + 1;
var year = start.getFullYear();
var str = day + '.' + month + '.' + year;
$('#startDateFilter').val(str.concat(" 00:00"));
$('#endDateFilter').val(str.concat(" 23:59"));
}
var table;
function reload() {
table.ajax.reload();
}
function loadTable() {
table = $('#example').DataTable({
"processing": true,
"serverSide": true,
"searching": false,
"bLengthChange": false,
"ajax": {
"url": "/updateWithParams",
"type": "POST",
"data": function (d) {
return $('#formFilter').serializeArray();
}
},
"columns": [
{"data": "id"},
{"data": "name"},
{
"targets": -1,
"data": "status",
"render": function (data, type, full) {
if (data == 0) return "<p> Новая </p>";
if (data == 1 || data == 2) return "<p> Выполняется </p>";
if (data == 3) return "<p> Выполнено </p>";
if (data == 4) return "<p> Отменено </p>";
}
},
{
"data": "dateCreated",
"render": function (data) {
var dateStart = new Date(data);
var day = dateStart.getDate();
var month = dateStart.getMonth() + 1;
var year = dateStart.getFullYear();
return day + '.' + month + '.' + year;
}
},
{"data": "userName"},
{
"targets": -1,
"data": null,
"render": function (data, type, full) {
if (data.status == '0') {
return "<button type='button' class='btn btn-info'>Запустить</button>";
}
if (data.status == '1' || data.status == '2') {
return "<button type='button' class='btn btn-primary'>Остановить</button>";
}
if (data.status == '3') {
return "<button type='button' class='btn btn-info'>Скачать</button>";
}
if (data.status == '4') {
return "<button type='button' class='btn btn-warning'>Отменено</button>";
}
}
}
]
});
$('#example tbody').on('click', 'td', function () {
var id = table.cell(this).data().id;
var status = table.cell(this).data().status;
console.log("id: " + id + " status: " + status);
if (status == '0') startResolution(id);
if (status == '1' || status == '2') stopResolution(id);
if (status == '3') downloadResolution(id);
});
}
答案 0 :(得分:0)
如果服务器端的数据已更新,并且您想在前端手动更新:
在可以更新表格中显示的数据的环境中 在服务器端,能够重新加载表通常很有用, 显示最新数据。这种方法提供了这种能力, 向已定义的URL发出Ajax请求(如果使用ajax.url() 你需要改变URL。)
fnReloadAjax插件的工作方式也相同,但从DataTables 1.10及以上版本开始不推荐使用。
即:
var table = null;
function loadTable() {
table = $('#example').DataTable({
"processing": true,
"serverSide": true,
"searching": false,
"bLengthChange": false,
"ajax": {
"url": "/updateWithParams",
"type": "POST",
"data": function (d) {
return $('#formFilter').serializeArray();
}
},
............
}
function reloadTable(){
table.ajax.reload();
// or
// table.ajax.reload( null, false ); // user paging is not reset on reload
}
答案 1 :(得分:0)
您可以在应用搜索过滤器后刷新数据表:
$('#example').DataTable().draw();
即使没有更改搜索过滤器,也会调用我认为会重新加载当前页面的方法。