使用DataTables插件时我遇到了一些问题。
首次加载页面时,结果会完美显示。但是当我应用过滤器时,按下搜索按钮并完成AJAX调用,该寻呼机不会更新并显示与开头相同数量的注册表。
这是我用于AJAX调用的源代码:
function GetRegisteredAdmonition(initialConsecutive, finalConsecutive, supervisorEmployeeNumber, bannedEmployeeNumber, disciplinaryAction, status, startDate, finalDate) {
$.ajax({
type: "POST",
url: "reviewAdmonition.aspx/GetAdmonition",
data: JSON.stringify({
initialConsecutive: initialConsecutive,
finalConsecutive: finalConsecutive,
supervisorEmployeeNumber: supervisorEmployeeNumber,
bannedEmployeeNumber: bannedEmployeeNumber,
disciplinaryAction: disciplinaryAction,
status: status,
startDate: startDate,
finalDate: finalDate
}),
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false,
success: OnSuccessGetAdmonition
});}
function OnSuccessGetAdmonition(response) {
$("#admonitionBody").empty();
var xmlDoc = $.parseXML(response.d);
var xml = $(xmlDoc);
console.log(response.d);
$(xml).find("Table").each(function () {
var consecutive = $(this).find('Folio').text();
var supervisorEmployeeNumber = $(this).find('NóminaOriginador').text();
var supervisorName = $(this).find('Originador').text();
var bannedEmployeeNumber = $(this).find('NóminaAmonestado').text();
var bannedEmployeeName = $(this).find('Amonestado').text();
var action = $(this).find('MedidaDisciplinaria').text();
var state = $(this).find('stepName').text();
var creationDate = $(this).find('Fecha_x0020_creación').text().split('T')[0];
switch (state) {
case 'Esperando aprobación':
$('<tr></tr>').html('<td>' + consecutive + '</td > <td>' + bannedEmployeeNumber + '</td> <td>' + bannedEmployeeName + '</td> <td>' + supervisorEmployeeNumber + '</td> <td>' + supervisorName + '</td> <td>' + action + '</td> <td>' + state + '</td> <td>' + creationDate + '</td><td><button type="button" class="btn btn-default btn-round btn-white approveAdmonition"><i class="ace-icon fa fa-check green"></i></button><button type="button" class="btn btn-default btn-round btn-white rejectAdmonition"><i class="ace-icon fa fa-undo orange"></i></button><button type="button" class="btn btn-default btn-round btn-white editAdmonition"><i class="ace-icon fa fa-pencil blue"></i></button><button type="button" class="btn btn-default btn-round btn-white cancelAdmonition"><i class="fa fa-trash text-danger"></i></button></td>').appendTo('#tblAdmonition');
break;
case 'Aprobada':
$('<tr></tr>').html('<td>' + consecutive + '</td > <td>' + bannedEmployeeNumber + '</td> <td>' + bannedEmployeeName + '</td> <td>' + supervisorEmployeeNumber + '</td> <td>' + supervisorName + '</td> <td>' + action + '</td> <td>' + state + '</td> <td>' + creationDate + '</td><td><button type="button" class="btn btn-default btn-round btn-white reprintAdmonition"><i class="ace-icon fa fa-print green"></i></button><button type="button" class="btn btn-default btn-round btn-white editAdmonition"><i class="ace-icon fa fa-pencil blue"></i></button></td>').appendTo('#tblAdmonition');
break;
case 'Rechazada':
$('<tr></tr>').html('<td>' + consecutive + '</td > <td>' + bannedEmployeeNumber + '</td> <td>' + bannedEmployeeName + '</td> <td>' + supervisorEmployeeNumber + '</td> <td>' + supervisorName + '</td> <td>' + action + '</td> <td>' + state + '</td> <td>' + creationDate + '</td>').appendTo('#tblAdmonition');
break;
case 'Cancelada':
$('<tr></tr>').html('<td>' + consecutive + '</td > <td>' + bannedEmployeeNumber + '</td> <td>' + bannedEmployeeName + '</td> <td>' + supervisorEmployeeNumber + '</td> <td>' + supervisorName + '</td> <td>' + action + '</td> <td>' + state + '</td> <td>' + creationDate + '</td>').appendTo('#tblAdmonition');
break;
}
});
var table = $('#tblAdmonition').DataTable({
retrieve: true,
"language": {
"url":"Scripts/Spanish.json"
},
dom: 'Bfrtip',
buttons: [
'copy', 'csv', 'excel', 'pdf', 'print'
]
});
}
正如你所看到的,我试图清理表体,但这不起作用。
我附上一些照片来澄清这些信息。在图像中,您可以看到表中只有一个注册表,但是寻呼机显示了3个以上的页面,总共有25个注册表。