可以datepicker mindate有两个日期

时间:2016-02-10 17:03:09

标签: jquery-ui-datepicker

$(tdForDatePicker).datepicker({
      numberOfMonths: [1, 1],
      dateFormat: "mm/dd/yy",
      defaultDate: myMinDateBegin,
      minDate: {date1:'01/03/2014', date2:'06/18/2014'},
      maxDate: {date1:'01/141/2014', date2: '06/30/2014'},
      onSelect: function () {
            $(this).focusin();                               
            }
      });

这是我想要做的一个例子。用户可以使用两个范围:'01 / 03/2014'maxdate:'01 / 14/2014'并注意:'06 / 18/2014',maxdate:of '06 / 30/2014'。 multiDatesPicker在我的应用程序的这一部分中无法正常工作。如何使datepicker为用户提供两个mindate和两个maxdate选项。我在stackoverflow中的搜索没有找到这个独特的功能。

更新:在jQuery datepicker, custom range quirk

上找到此解决方案

这是我现在的代码:

ranges = [{ start: moment(new Date('01/03/2014')).format("MM/DD/YYYY"), end: moment(new Date('01/14/2014')).format("MM/DD/YYYY") },
               { start: moment(new Date('06/18/2014')).format("MM/DD/YYYY"), end: moment(new Date('06/30/2014')).format("MM/DD/YYYY") }];
    myMinDateBegin = ranges[0].start;
    myMaxDateBegin = ranges[ranges.length - 1].end;
    console.log('minDateBeginOnEdit', myMinDateBegin + " " + myMaxDateBegin);
    $(tdForDatePicker).datepicker({
        numberOfMonths: [1, 1],
        dateFormat: "mm/dd/yy",
        beforeShowDay: function(date) {
            $.each(ranges, function (index) {
                    if(date >= ranges[index].start && date <= ranges[index].end){
                        return [true, ''];
                    }
                })
                return [false, ''];
            },
        minDate: myMinDateBegin,
        maxDate: myMaxDateBegin,          
        defaultDate: myMinDateBegin,
        onSelect: function () {
            $(this).focusin();                               
        }
    })

控制台显示日期为01/03/2014和06/30/2014。 datepicker的所有日期都显示为灰色。

1 个答案:

答案 0 :(得分:1)

这包含解决方案jQuery ui: multiple ranges for date picker?

我的代码

name

该链接提供了一个小提琴。感谢。