Диапазон дат без встроенного DatePicker

Question

Я пытаюсь сделать что-то вроде в этой теме: Date range picker on jquery ui datepicker

Но я не хочу, чтобы DatePicker быть инлайн, и этот код работает только с инлайн DatePicker.

Мне нужна только датапикер при выборе # даты1 или # даты2.

Мне должно быть легко, но я застрял здесь, и единственными решениями, которые я нахожу в google, являются плагины или встроенный datepicker.

Answer 1

jQuery UI DatePicker по умолчанию является выпадающим списком, поэтому пример, который вы нашли, немного устарел, я думаю.

https://jsfiddle.net/gRoberts/z4j227h6/

$("#from").datepicker({ 
    defaultDate: "+1w", 
    changeMonth: true, 
    numberOfMonths: 3, 
    onClose: function(selectedDate) { 
    $("#to").datepicker("option", "minDate", selectedDate); 
    } 
}); 
$("#to").datepicker({ 
    defaultDate: "+1w", 
    changeMonth: true, 
    numberOfMonths: 3, 
    onClose: function(selectedDate) { 
    $("#from").datepicker("option", "maxDate", selectedDate); 
    }, 
    beforeShowDay: function (date) { 
    var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#from").val()); 
    var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#to").val()); 
    return [true, date1 && ((date.getTime() == date1.getTime()) || (date2 && date >= date1 && date <= date2)) ? "dp-highlight" : ""]; 
    }, 
}); 

Приведенная выше код/​​скрипка показывает, что с некоторыми незначительными изменениями, вы можете повторить функциональность в раскрывающемся списке.

HTH.