【发布时间】:2019-08-01 14:51:09
【问题描述】:
我正在使用 moment.js daterangepicker 从用户界面接受 from 和 to date。但是,每当我希望将日期范围设置为超过一个月或一年时,日历日期会自动将它们调整为一个月的日期范围。
我浏览了文档并尝试了属性 maxSpan、autoUpdate 等。 今天,上个月等的范围工作正常。 我需要自定义范围来接受任何日期范围。
<script src="resources/js/moment/moment.min.js"></script>
<script>
var startDate;
var endDate;
var startDateCount = <%= l_startdatecount%>;
var endDateCount = <%= l_enddatecount%>;
startDateCount = -startDateCount;
endDateCount = -endDateCount;
$(document).ready(function() {
$('#reportrange_right').daterangepicker( {
startDate: moment().subtract(startDateCount, 'days'),
endDate: moment().subtract(endDateCount, 'days'),
minDate: '01/01/2012',
maxDate: '01/01/2050',
dateLimit: {
days: 365
},
showDropdowns: true,
showWeekNumbers: true,
timePicker: false,
timePickerIncrement: 1,
timePicker12Hour: true,
ranges: {
'Today': [moment(), moment()],
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
'Last 7 Days': [moment().subtract(6, 'days'), moment()],
'Last 30 Days': [moment().subtract(29, 'days'), moment()],
'This Month': [moment().startOf('month'), moment()],
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
},
opens: 'right',
buttonClasses: ['btn btn-default'],
applyClass: 'btn-small btn-primary',
cancelClass: 'btn-small',
format: 'MM/DD/YYYY',
separator: ' to ',
locale: {
applyLabel: 'Submit',
cancelLabel: 'Clear',
fromLabel: 'From',
toLabel: 'To',
customRangeLabel: 'Custom',
daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
firstDay: 1
}
},
function(start, end) {
$('#reportrange_right span').html(start.format('D MMMM YYYY') + ' - ' + end.format('D MMMM YYYY'));
startDate = start.startOf('day');
endDate = end.startOf('day');
}
);
$('#reportrange_right span').html(moment().subtract(startDateCount, 'days').format('D MMMM YYYY') + ' - ' + moment().subtract(endDateCount, 'days').format('D MMMM YYYY'));
startDate = moment().startOf('day').subtract(startDateCount, 'days');
endDate = moment().startOf('day').subtract(endDateCount, 'days')
$('[data-toggle="tooltip"]').tooltip();
});
</script>
预期输出: 左日历选择 2018-07-29,然后右日历可以选择从 2018-07-29 到未来的任何日期。
实际输出: 左侧日历选择 2018-07-29,右侧日历仅允许 2019 年 8 月的日期,反之亦然。
【问题讨论】:
标签: momentjs