我有以下代码对我的数据表执行过滤器。
$("a").click(function(event){
$("#datepicker").val('',3);
oTable.fnFilter(this.InnterHtml,3);
好的,这是清除此日期选择器文本框,然后根据在 a href 标记中选择的内容应用特定过滤器。
我现在的问题是,当我使用下拉菜单显示“所有”记录时,它不起作用。如何清除数据表中的所有过滤器,并将其恢复为默认状态。
这是完整的 JQuery 代码。
$(document).ready(function () {
var oTable;
function renderDetailTable(result) {
var dtDetailData = [];
$.each(result, function () {
dtDetailData.push([
this.Sender,
this.MessageDate,
this.MessageTime,
this.Reference,
this.MessageType,
this.Receiver,
this.ValueDate,
this.Currency,
this.Amount
]);
});
$.datepicker.regional[""].dateFormat = 'dd/mm/yy';
$.datepicker.setDefaults($.datepicker.regional['']);
oTable = $('#tblMessageDetail').dataTable({
"aaData": dtDetailData,
"aLengthMenu": [[10, 25,50, 100, -1], [10, 25,50, 100, "ALL"]],
"asStripClasses": null,
"iDisplayLength": 10,
//"aaSorting": [[0, "asc"]],
"bJQueryUI": true,
"bFilter": true,
//"bAutoWidth": false,
//"bProcessing": true,
// "sDom": 'RC<"clear">lfrtip',
"sDom": 'RC<"H"lfr>t<"F"ip>',
"aoColumnDefs": [
{"bVisible": false, "aTargets": [11,12,13,14]}
],
//Scrolling .......
"sScrollY": "250px",
"sScrollX": "100%",
"sScrollXInner": "100%",
"bScrollCollapse": true,
//Dynamic Language .......
"oLanguage": {
"sZeroRecords": "There are no messages that match your search criteria",
"sLengthMenu": "Display _MENU_ records per page ",
"sInfo": "Displaying _START_ to _END_ of _TOTAL_ records",
"sInfoEmpty": "Showing 0 to 0 of 0 records",
"sInfoFiltered": "(filtered from _MAX_ total records)",
"sEmptyTable": 'No Rows to display.....!',
"sSearch": "Search all columns:"
},
"oSearch": {
"sSearch": "",
"bRegex": false,
"bSmart": true
}
});
}
$.ajax({
type: 'POST',
url: 'Default.aspx/GetMessageDetail',
data: '{}',
contentType: 'application/json;charset=utf-8',
dataType: 'json',
success: function (response) {
//console.log(response);
//alert(response.d);
renderDetailTable(response.d);
},
error: function (errMsg) {
$('#errorMessage').text(errMsg);
}
});
$("#datepicker").datepicker({
"onSelect": function (date) {
oTable.fnFilter(date, 1);
}
}).keyup(function () {
oTable.fnFilter('');
oTable.fnFilter(this.value, 1);
});
$(".reference").click(function (event) {
event.preventDefault();
$("#datepicker").val('');
oTable.fnFilter('',1);
oTable.fnFilter(this.innerHTML, 3);
});
$("#resetTable").click(function (event) {
// event.preventDefault();
alert("clicked");
// oTable.fnResetAllFilters();
});
});
下拉列表是数据表的一部分