基于另一个datepicker或文本框限制jquery datepicker中的日期 [英] Restrict date in jquery datepicker based on another datepicker or textbox

问题描述

我有两个带有日期选择器的文本框.文本框用于开始日期和结束日期.设置第一个日期选择器，以便用户不能选择今天之前的日期，而可以选择将来的任何日期.

I have two text boxes with a datepicker hooked up to them. The text boxes are for start date and end date. The first datepicker is setup so that the user cannot choose a date before today, but can choose any date in the future.

如何设置第二个日期选择器，使其不能选择在第一个日期选择器中选择的日期之前的日期?例如:如果今天是10/12/11，而我在第一个日期选择器中选择了12/15/10，那么第二个日期选择器将不能选择12/15/10之前的任何内容.

How can I setup the second datepicker so that it cannot choose a date before the date chosen in the first date picker? For example: If today is 12/11/10 and I choose 12/15/10 in the first datepicker, then the second date picker shouldn't be able to choose anything before 12/15/10.

这里是我到目前为止的内容:

Heres what I have so far:

$("#txtStartDate").datepicker({ minDate: 0 });
$("#txtEndDate").datepicker({});

推荐答案

例如，在此示例代码中，将startDatePicker选择为2010-12-12，startDatePicker的change事件设置了endDatePicker 2010-12-13的minDate.它在此日期之前锁定单元格.这是@Victor提到的示例.我希望它对您有帮助...关于...奥兹莱姆.

For example, in this sample code, startDatePicker is selected as 2010-12-12, change event of startDatePicker sets the minDate of endDatePicker 2010-12-13. It locks the cells before this date. This is a sample for what @Victor mentioned..I hope it helps...Regards...Ozlem.

$("#startDatePicker").datepicker({ 
    dateFormat: 'yy-mm-dd',
    changeMonth: true,
    minDate: new Date(),
    maxDate: '+2y',
    onSelect: function(date){

        var selectedDate = new Date(date);
        var msecsInADay = 86400000;
        var endDate = new Date(selectedDate.getTime() + msecsInADay);

       //Set Minimum Date of EndDatePicker After Selected Date of StartDatePicker
        $("#endDatePicker").datepicker( "option", "minDate", endDate );
        $("#endDatePicker").datepicker( "option", "maxDate", '+2y' );

    }
});

$("#endDatePicker").datepicker({ 
    dateFormat: 'yy-mm-dd',
    changeMonth: true
});

这篇关于基于另一个datepicker或文本框限制jquery datepicker中的日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！