2015-01-05 5 views
3

Я хотел бы ограничить свой календарь, чтобы пользователи ограничивали диапазон дат.jQuery datepicker: Limit date from selected Дата

Например: если пользователь выбирает 10 марта 2014 года в поле «От», пользователь не должен выбирать после 10 июня 2014 года в разделе «Кому».

Вот код, который я сделал:

Спасибо заранее.

$(function() { 
    $("#from").datepicker({ 
     maxDate: 0, 
     dateFormat : 'dd-mm-yy', 
     onClose: function(selectedDate) { 
     $("#to").datepicker("option", "minDate", selectedDate); 
     var date = $(this).datepicker('getDate'); 
     var maxDate = new Date(date.getMonth() + 3); 
     $("#to").datepicker("option", "maxDate", maxDate); 
     } 
    }); 

    $("#to").datepicker({ 
     maxDate: 0, 
     onClose: function(selectedDate) { 
      $("#from").datepicker("option", "maxDate", selectedDate); 
     } 
    }); 
} 

ответ

1

Вы можете получить месяц с From datepicker и прирост до 3 месяцев для maxDate of the datepicker.

$("#from").datepicker({ 
     dateFormat: "dd-M-yy",    
     minDate: 0, 
     onSelect: function (date) { 
      var date2 = $('#from').datepicker('getDate'); 
      date2.setMonth(date2.getMonth() + 3); 
      $('#to').datepicker('setDate', date2); 
      $('#to').datepicker('option', 'maxDate', date2); 
     } 
    }); 
    $('#to').datepicker({ 
     dateFormat: "dd-M-yy", 
     onClose: function() {     
      var from = $('#from').datepicker('getDate'); 
      console.log(from); 
      var to = $('#to').datepicker('getDate'); 
      if (to <= from) { 
       var minDate = $('#dt2').datepicker('option', 'minDate'); 
       $('#from').datepicker('setDate', minDate); 
      } 
     } 
    }); 

Проверить эту скрипку:

http://jsfiddle.net/PPSh3/586/

+0

Спасибо. это была огромная помощь. –

+0

Добро пожаловать. Я рад, что это вам помогло. – user3263194

-2
$(function() { 
    $("#to").datepicker(); 
    $("#from").datepicker({ 
     maxDate: 0, 
     dateFormat : 'dd-mm-yy', 
     onSelect: function(selectedDate) { 
      $("#to").datepicker("setDate", selectedDate); 
      $("#to").datepicker("option", "minDate", selectedDate); 
      var date = $(this).datepicker('getDate'); 
      var maxDate = date.setMonth(date.getMonth() + 3); 
      $("#to").datepicker("option", "maxDate", maxDate); 
    } 
}); 
0

Проблема связана с тем, как вы используете даты. Пожалуйста, проверьте это fiddle

Вы должны разобрать дату в допустимом формате перед назначением его вариант MaxDate или MinDate OFTHE DatePicker:

 var arr = selectedDate.split("-"); 
     var date = new Date(arr[2] + "-" + arr[1] + "-" + arr[0]); 
     var d = date.getDate(); 
     var m = date.getMonth(); 
     var y = date.getFullYear(); 
     var minDate = new Date(y, m + 1, d); 
     $("#to").datepicker("option", "minDate", minDate); 
     //var date = $(this).datepicker('getDate'); 
     var maxDate = new Date(y, m + 3, d); 
     $("#to").datepicker("option", "maxDate", maxDate); 

То же самое относится и к другим DatePicker:

 var arr = selectedDate.split("-"); 
     var date = new Date(arr[2] + "-" + arr[1] + "-" + arr[0]); 
     $("#from").datepicker("option", "maxDate", date); 

Надеюсь, что это поможет.

Смежные вопросы