0

我們正在使用引導日期選擇器(https://github.com/uxsolutions/bootstrap-datepicker)設置簽入和籤日期。引導日期選擇器設置最小範圍

我們需要能夠在日期選擇器設置一個「最小範圍」爲具有最小晚住宿性能。

遺漏的需求:

  • 不允許停留天數小於屬性夜間最低。
  • 不允許結帳日期在簽入日期之前。

因此,如果遊客選擇的2017年12月1日簽入日期和財產的最小晚住宿3晚,訪問者不應該被允許選擇2017年12月2日,12/03/2017。下一個晚上他們去結帳應該是12/04/2017。

,我沒有看到,這是與此日期選取一個簡單的選擇。儘管如此,我確實已經看到它已被添加爲功能請求。 https://github.com/uxsolutions/bootstrap-datepicker/issues/970

我已經通過使用disabledDates和setDatesDisabled日期構建了可能能夠工作的開始。然而,我似乎無法弄清楚爲什麼這些禁用日期在選擇新的開始日期時不工作或解僱。我認爲我應該能夠將新設置的禁用日期與已發佈的日期結合起來。

$(function($) { 

    var today = new Date(); 
    $('.input-daterange').datepicker({ 
     daysOfWeekHighlighted: "0,6", 
     autoclose: true, 
     todayHighlight: true, 
     startDate: today, 
     datesDisabled: ['10/1/2017','10/2/2017','10/3/2017','10/4/2017','10/5/2017','10/6/2017','10/7/2017','10/8/2017','10/9/2017','10/10/2017','10/11/2017','10/12/2017','10/13/2017','10/14/2017','10/15/2017','10/16/2017','10/17/2017','10/18/2017','10/19/2017','10/20/2017','10/21/2017','10/22/2017','10/23/2017','10/24/2017','10/25/2017','10/26/2017','10/27/2017','10/28/2017','10/29/2017','10/30/2017','10/31/2017'], 
    }); 

}); 

// Set end date to minimum nights. 
$('#start').on('change', function() { 

    // Set minNights. 
    minNights = 3; 

    start = $('#start').datepicker('getDate'); 
    end = moment(start).add(minNights, 'day').toDate(); 
    $('#end').datepicker('update', end); 

    $('.input-daterange').datepicker('setDatesDisabled', [ $('.input-daterange').datepicker('setDatesDisabled', ['12/02/2017', '12/03/2017']);]); 

}); 

是否有另一個日期選擇器,這已經內置已經?或者,有沒有一種簡單而乾淨的方法將缺少的需求添加到引導日期選擇器?

簡單的jsfiddle

回答

0

試試這個

$(function() { 
    $('#datepicker').datepicker({ 
     dateFormat: 'yy-mm-dd', 
     showButtonPanel: true, 
     changeMonth: true, 
     changeYear: true, 
yearRange: '1999:2012', 
     showOn: "button", 
     buttonImage: "images/calendar.gif", 
     buttonImageOnly: true, 
     minDate: new Date(1999, 10 - 1, 25), 
     maxDate: '+30Y', 
     inline: true 
    }); 
}); 
相關問題