DataTables 日期范围过滤器,没有得到第一个日期
DataTables date range filter, not getting the first date
您好,我正在使用 DataTables 日期范围过滤器。这是 link -> https://datatables.net/extensions/datetime/examples/integration/datatables.html
下面是我的代码
var minDate, maxDate;
// Custom filtering function which will search data in column four between two values
$.fn.dataTable.ext.search.push(
function( settings, data, dataIndex ) {
var min = minDate.val();
var max = maxDate.val();
var date = new Date( data[9] );
if (
( min === null && max === null ) ||
( min === null && date <= max ) ||
( min <= date && max === null ) ||
( min <= date && date <= max )
) {
return true;
}
return false;
}
);
$(document).ready(function() {
// Create date inputs
minDate = new DateTime($('#min'), {
format: 'MM-DD-YYYY'
});
maxDate = new DateTime($('#max'), {
format: 'MM-DD-YYYY'
});
$('#sales').DataTable({
aLengthMenu: [
[25, 50, 100, 200, -1],
[25, 50, 100, 200, "All"]
],
iDisplayLength: -1,
scrollX: true
});
// DataTables initialisation
var table = $('#sales').DataTable();
// Refilter the table
$('#min, #max').on('change', function () {
table.draw();
});
});
当我从 04-01-2022 搜索到 04-03-2022 时。它没有显示 04-01-2022 的记录
但是当我输入 03-31-2022 到 04-02-2022 它显示了 [=22= 的记录]04-01-2022
您似乎在 document.ready
上设置了一次 MinDate
和 MaxDate
,但在用户输入日期后没有设置。
我已将设置 MinDate
和 MaxDate
的代码移动到您的搜索过滤器中。
另一个潜在的问题是,您正在比较 MM-DD-YYYY 格式的日期,就好像它们是字符串一样,这在比较 03-12-2022 和 05-12-2020 时不起作用.从日期的角度来看,第一次约会较晚,但从 string-comparison 的角度来看较早(第一次)。因此,您可能应该将日期转换为 YYYY-MM-DD 格式,这适用于字符串比较。
我不确定这最后一部分,因为你有 new Date(...)
(这是标准的 JS)以及 new DateTime(...)
(我认为这不是标准的 JS)所以它不是非常清楚您是在比较字符串(例如 minDate.val()
)还是对象(例如 new Date( data[9] )
)。
var minDate, maxDate;
// Custom filtering function which will search data in column four between two values
$.fn.dataTable.ext.search.push(
function( settings, data, dataIndex ) {
// Create date inputs
minDate = new DateTime($('#min'), {
format: 'MM-DD-YYYY'
});
maxDate = new DateTime($('#max'), {
format: 'MM-DD-YYYY'
});
var min = minDate.val();
var max = maxDate.val();
var date = new Date( data[9] );
if (
( min === null && max === null ) ||
( min === null && date <= max ) ||
( min <= date && max === null ) ||
( min <= date && date <= max )
) {
return true;
}
return false;
}
);
$(document).ready(function() {
$('#sales').DataTable({
aLengthMenu: [
[25, 50, 100, 200, -1],
[25, 50, 100, 200, "All"]
],
iDisplayLength: -1,
scrollX: true
});
// DataTables initialisation
var table = $('#sales').DataTable();
// Refilter the table
$('#min, #max').on('change', function () {
table.draw();
});
});
您好,我正在使用 DataTables 日期范围过滤器。这是 link -> https://datatables.net/extensions/datetime/examples/integration/datatables.html
下面是我的代码
var minDate, maxDate;
// Custom filtering function which will search data in column four between two values
$.fn.dataTable.ext.search.push(
function( settings, data, dataIndex ) {
var min = minDate.val();
var max = maxDate.val();
var date = new Date( data[9] );
if (
( min === null && max === null ) ||
( min === null && date <= max ) ||
( min <= date && max === null ) ||
( min <= date && date <= max )
) {
return true;
}
return false;
}
);
$(document).ready(function() {
// Create date inputs
minDate = new DateTime($('#min'), {
format: 'MM-DD-YYYY'
});
maxDate = new DateTime($('#max'), {
format: 'MM-DD-YYYY'
});
$('#sales').DataTable({
aLengthMenu: [
[25, 50, 100, 200, -1],
[25, 50, 100, 200, "All"]
],
iDisplayLength: -1,
scrollX: true
});
// DataTables initialisation
var table = $('#sales').DataTable();
// Refilter the table
$('#min, #max').on('change', function () {
table.draw();
});
});
当我从 04-01-2022 搜索到 04-03-2022 时。它没有显示 04-01-2022 的记录
但是当我输入 03-31-2022 到 04-02-2022 它显示了 [=22= 的记录]04-01-2022
您似乎在 document.ready
上设置了一次 MinDate
和 MaxDate
,但在用户输入日期后没有设置。
我已将设置 MinDate
和 MaxDate
的代码移动到您的搜索过滤器中。
另一个潜在的问题是,您正在比较 MM-DD-YYYY 格式的日期,就好像它们是字符串一样,这在比较 03-12-2022 和 05-12-2020 时不起作用.从日期的角度来看,第一次约会较晚,但从 string-comparison 的角度来看较早(第一次)。因此,您可能应该将日期转换为 YYYY-MM-DD 格式,这适用于字符串比较。
我不确定这最后一部分,因为你有 new Date(...)
(这是标准的 JS)以及 new DateTime(...)
(我认为这不是标准的 JS)所以它不是非常清楚您是在比较字符串(例如 minDate.val()
)还是对象(例如 new Date( data[9] )
)。
var minDate, maxDate;
// Custom filtering function which will search data in column four between two values
$.fn.dataTable.ext.search.push(
function( settings, data, dataIndex ) {
// Create date inputs
minDate = new DateTime($('#min'), {
format: 'MM-DD-YYYY'
});
maxDate = new DateTime($('#max'), {
format: 'MM-DD-YYYY'
});
var min = minDate.val();
var max = maxDate.val();
var date = new Date( data[9] );
if (
( min === null && max === null ) ||
( min === null && date <= max ) ||
( min <= date && max === null ) ||
( min <= date && date <= max )
) {
return true;
}
return false;
}
);
$(document).ready(function() {
$('#sales').DataTable({
aLengthMenu: [
[25, 50, 100, 200, -1],
[25, 50, 100, 200, "All"]
],
iDisplayLength: -1,
scrollX: true
});
// DataTables initialisation
var table = $('#sales').DataTable();
// Refilter the table
$('#min, #max').on('change', function () {
table.draw();
});
});