我使用JQuery DataTable。我创建了一个函数,从ajax成功的spring Controller发送数据到datatable。现在一切都很好,现在我想添加一个日期范围过滤器,它适用于表的默认内容但问题是当内容时该表随着ajax函数的变化而变化,日期范围过滤器仍然是默认内容的过滤器。
这是日期范围过滤器
$(document).ready(function(){
$.fn.dataTable.ext.search.push(
function (settings, data, dataIndex) {
var min = $('#date_added').datepicker("getDate");
var max = $('#date_modified').datepicker("getDate");
var d = data[2].split("/");
var startDate = new Date(d[0]+ "/" + d[1] +"/" + d[2]);
if (min == null && max == null) { return true; }
if (min == null && startDate <= max) { return true;}
if(max == null && startDate >= min) {return true;}
if (startDate <= max && startDate >= min) { return true; }
return false;
}
);
$("#date_added").datepicker({ onSelect: function () { table.draw(); }, changeMonth: true, changeYear: true });
$("#date_modified").datepicker({ onSelect: function () { table.draw(); }, changeMonth: true, changeYear: true });
var table = $('#datatable').DataTable();
// Event listener to the two range filtering inputs to redraw on input
$('#date_added, #date_modified').change(function () {
var table = $('#datatable').DataTable();
table.draw();
});
});
这是ajax函数
$.ajax({
type : "GET",
contentType : "application/json",
url : "http://localhost:8081/BackEndFinalVersion/listCourriersArrivés",
data: { get_param: 'value' },
dataType : 'json',
timeout : 100000,
success :function(data) {
trHTML = '';
$('input[type=radio][name=radioInline]').change(function() {
if (data == null) {
alert("No records"+data);
//trHTML = '<tr><td>'No Records to be show'</td></tr>';
} else if(this.value == 'option2'){
$.each(data, function(i, item) {
$("body").on("click", "#datatable tr", function () {
window.location ="/Pro/mail_detail?id="+item.idCourrier;
});
trHTML += '<tr><td>' + item.expéditeur + '</td><td>' + item.société + '</td><td>' + item.date + '</td><td>' + item.objet + '</td></tr>';
});
$('#datatable tbody tr').remove();
$('#datatable tbody').append(trHTML);
}
trHTML = '';
})
},
error : function(e) {
console.log("ERROR: ", e);
alert(e);
},
});
});