日期选择器范围不允许退房日期为当天

时间:2018-12-11 07:08:10

标签: javascript jquery html css jquery-ui-datepicker

我正在尝试同一天的入住和退房日期,但是我不允许这样做。请帮我做到这一点。

var ajax_check_var = '';
$('.location_search_results_ul').hide();

$("#check_in_time").datepicker({
    showOtherMonths: true,
    dateFormat: 'dd-mm-yy',
    minDate: 0,
    //for calender Css
    beforeShowDay: function (date) {
        return highlightDateBorder($("#check_in_time").val(), date);
    },
    onSelect: function(selectedDate) {
        var date_format = selectedDate.split("-");
        var selectedDate = new Date($.datepicker.formatDate('yy-mm-dd', new Date(date_format[2], date_format[1] - 1, date_format[0])));
        selectedDate.setDate(selectedDate.getDate() + 1);
        $("#check_out_time").datepicker("option", "minDate", selectedDate);
    },
});

$("#check_out_time").datepicker({
    showOtherMonths: true,
    dateFormat: 'dd-mm-yy',
    //for calender Css
    beforeShowDay: function (date) {
        return highlightDateBorder($("#check_out_time").val(), date);
    },
    beforeShow: function (input, instance) {
        var date_to = $('#check_in_time').val();
        if (typeof date_to != 'undefined' && date_to != '') {
            var date_format = date_to.split("-");
            var selectedDate = new Date($.datepicker.formatDate('yy-mm-dd', new Date(date_format[2], date_format[1] - 1, date_format[0])));
            selectedDate.setDate(selectedDate.getDate()+1);
            $("#check_out_time").datepicker("option", "minDate", selectedDate);
        } else {
            var date_format = new Date();
            var selectedDate = new Date($.datepicker.formatDate('yy-mm-dd', new Date()));
            selectedDate.setDate(selectedDate.getDate()+1);
            $("#check_out_time").datepicker("option", "minDate", selectedDate);
        }
    }
});

1 个答案:

答案 0 :(得分:0)

在代码中多次将minDate日期选择器的check_out_time设置为selectedDate。但是,selectedDate永远不是实际选择的日期,而是选择的日期+ 1,因为下面的行。

selectedDate.setDate(selectedDate.getDate()+1)

通过更改可以选择同一天。

我还建议清理所有重复的代码,您有很多行为会重复几次,这会使阅读变得一团糟:) 您可以将三行代码移至一个函数并调用该函数,而不仅仅是在三个位置重复基本相同的逻辑。

const date_format = selectedDate.split("-");
setMinData(new Date(date_format[2], date_format[1] - 1, date_format[0]));

function setMinDate(date) {
    var selectedDate = new Date($.datepicker.formatDate('yy-mm-dd', date));
    selectedDate.setDate(selectedDate.getDate() + 1);
    $("#check_out_time").datepicker("option", "minDate", selectedDate);
}