2014-01-24 136 views
1

我正在從DB日期值的指定範圍中加載DatePicker。在Jquery DatePicker中禁用日期

HTML代碼:

<div id="datepicker"> Select the Dates: 
    <input type="text" id="input1" > 
    <input type="text" id="input2"> 
</div> 

jQuery代碼:

var date1 = new Date(Date.parse(SSD)); 
var date2 = new Date(Date.parse(SED)); 

$("#input1").val($.datepicker.formatDate($.datepicker._defaults.dateFormat, date1)); 
$("#input2").val($.datepicker.formatDate($.datepicker._defaults.dateFormat, date2)); 

$("#datepicker").datepicker({ 
    defaultDate: date1, 
    beforeShowDay: function (date) { 
     var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input1").val()); 
     var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input2").val()); 
     return [true, date1 && ((date.getTime() == date1.getTime()) || (date2 && date >= date1 && date <= date2)) ? "dp-highlight" : ""]; 
    }, 
    onSelect: function (dateText, inst) { 
     var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input1").val()); 
     var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input2").val()); 
     if (!date1 || date2) { 
      $("#input1").val(dateText); 
      $("#input2").val(""); 
      $(this).datepicker("option", "minDate", dateText); 
     } else { 
      $("#input2").val(dateText); 
      $(this).datepicker("option", "minDate", null); 
     } 
    } 
}); 

這說明我在這個範圍內壓延。但現在要求最終用戶不能超出指定的日期。用戶只能在指定的範圍內選擇。用戶無法導航超出範圍。 我對jquery有點新,請建議。

+2

http://jqueryui.com/datepicker/#min-max – Jack

回答

1

要限制最小和最大日期有:

$(".selector").datepicker({ minDate: new Date(), maxDate: "+1m +1w" } }) 

minDatemaxDate文檔獲取更多信息。

+0

謝謝。它幫助。 – Maverick