从第一个日期选择器定义第二个日期选择器的开始日期 [英] Define start date of second date picker from first date picker

问题描述

我正在使用两个引导日期选择器，一旦用户在第一个日期选择器上单击任意日期，则第二个日期选择器的开始日期应为第一个，在第一个日期选择器中选择，并且在此之前所有日期应

I am working on having two bootstrap date pickers, once the user clicks on any date on the first date-picker the start date of the second date picker should be that, selected in the first date picker and before that all dates should be disabled.

但是肯定我走错了方向，我无法弄清楚。diffDays变量的值未反映在第二个日期的startDate字段中-picker，因此开始日期不会反映在第二个日期选择器中。

But certainly I am going some wrong way I could not figure out.The value of the variable diffDays is not being reflected in the startDate field of the second date-picker and therefore the start date is not being reflected in second date-picker.

下面是代码：

function checkDate(startDate) {
    var oneDay = 24 * 60 * 60 * 1000;
    var res = startDate.value.split("/");
    var firstDate = new Date(res[2], res[1] - 1, res[0]);
    var todayFullDate = new Date();
    var diffDays = Math.round(Math.abs((firstDate.getTime() - todayFullDate
            .getTime())
            / (oneDay)));

    $('#date2').datepicker({

        startDate: '+'+diffDays+'d'
                });

}
$(function() {

    $('#date1').datepicker({
        format : "dd/mm/yyyy",
        required : true,

    });

    $("#register-form").validate({

        rules : {
            date1 : "required"
        },

        messages : {
            date1 : "Please enter a valid date"
        },

        submitHandler : function(form) {

            form.submit();
        }
    });

});

推荐答案

您可以使用简单的方法和选项以及其插件，如下所示：

You can make use of simple methods and options provided along with their plugin as below:

changeDate ， setStartDate 和 setEndDate 是您需要使用的3项重要内容。

changeDate, setStartDate and setEndDate are the 3 important things you need to make use of.

changeDate 是事件，当日期更改时会触发 。

changeDate is an event which is fired when the date is changed.

setStartDate 和 setEndDate 是为各个 datepickers 开始日期和结束日期的两种方法c $ c>。您需要将 changeDate 事件附加到 datepickers 并分别为日期选择器如下

setStartDate and setEndDate are the 2 methods which sets startdate and enddate for respective datepickers. You need to attach changeDate event to both the datepickers and set corresponding start and end dates for respective datepickers as below

$('.start').datepicker({
    autoclose:true
}).on('changeDate',function(e){
    //on change of date on start datepicker, set end datepicker's date
    $('.end').datepicker('setStartDate',e.date)
});

$('.end').datepicker({
    autoclose:true
}).on('changeDate',function(e){
    //on change of date on end datepicker, set start datepicker's date
    //e.date will have selected date value.
    $('.start').datepicker('setEndDate',e.date)
})

此处演示

这篇关于从第一个日期选择器定义第二个日期选择器的开始日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！