How to allow maxDate and minDate to be equal on Bootstrap DateTimePicker?

问题

In order to create a report, I need to be able to choose the same starting and ending date.
I'm able to do that, but only on the first time that I pick the maxDate.
After that I can't pick the same value of the minDate as maxDate.

E.g:
Browser opens up.
I choose 01/01/2020 as starting date (minDate).
I choose 01/01/2020 as ending date (maxDate).
I change ending date to 02/01/2020.
Now I'm unable to pick '01/01/2020' as ending date again.

I need to be able to select the same moment for minDate and maxDate
I can't seem to find a solution for this in the DateTimePicker documentation

I've tried setting some values on the change event:

$(".datetimepickerTo").on("dp.change", function (e) {
    $('.datetimepickerFrom').data("DateTimePicker").maxDate(e.date);
});

And on the datetimepicker selector:

$('.datetimepickerTo').datetimepicker({
    useCurrent: false
});

回答1:

Turns out it was a date format issue.
For some reason when selecting dates for the first time, the date output was:

'Wed Jan 01 2020 16:39:34 GMT-0300 (Horário Padrão de Brasília)'.

Where '16:39:34' was the actual time that I picked the date.

Although, on the second time selecting, the output was:

'Wed Jan 01 2020 00:00:00 GMT-0300 (Horário Padrão de Brasília)'

Making two different dates.

My approach was to format the date to the format that I needed. Using this function:

function formatDate(date) {
    var months = [
        "1", "2", "3",
        "4", "5", "6",
        "7", "8", "9",
        "10", "11", "12"
    ];

    var day = date.getDate();
    var monthIndex = date.getMonth();
    var year = date.getFullYear();

    return day + '/' + months[monthIndex] + '/' + year;
}

Where the output was:

01/01/2020

Then I just had to pass the formatted date to minDate() and maxDate() functions:

$(".datetimepickerFrom").datetimepicker().on("dp.change", function (e) {
    const formattedDate = formatDate(e.date.toDate())
    $('.datetimepickerTo').data("DateTimePicker").minDate(formattedDate);
});

$(".datetimepickerTo").datetimepicker().on("dp.change", function (e) {
    const formattedDate = formatDate(e.date.toDate())
    $('.datetimepickerFrom').data("DateTimePicker").maxDate(formattedDate);
});

来源：https://stackoverflow.com/questions/59753249/how-to-allow-maxdate-and-mindate-to-be-equal-on-bootstrap-datetimepicker

标签

javascript

jquery

bootstrap-datetimepicker