jQuery Datepicker date range заполняет inline calender

Question

Я пытаюсь получить поля диапазона дат даты дампинга jQuery, чтобы выделить выбранные даты в виде встроенного календаря. До сих пор я получил встроенный календарь, чтобы получить выбранные даты для заполнения двух разных полей: date1 и date2. Мне нужны только выбранные диапазоны дат, чтобы выделить выбранные даты внутри календаря.

Я создал jsfiddle здесь (Jsfiddle Demo)

Я попробовал метод JQuery альтернативного поля, но без успеха, любая помощь будет оценен по достоинству!

Вот фотография того, что я пытаюсь выполнить.

Answer 1

Обновлено

С вашими дополнительными комментариями я лучше понимаю, что вы пытаетесь сделать.

Working JSFiddle.

Краткое резюме:

• onSelect() это лучший способ справиться с выбором даты, и она передается выбранная дата в виде строки, так что я удалил свои .on() обработчиков и функцию getDate().

• Сохраните даты начала и окончания, когда они выбраны;

• Обновите свой встроенный datepicker с помощью $('#datepicker').datepicker('refresh');, когда вы выбрали start/end, чтобы ваш beforeShowDay() вызывал и может перерисовывать календарь с использованием выбранных дат. Он также уволил бы инициализацию встроенного datepicker, но поскольку на этом этапе не было выбрано никаких дат, он ничего не делал.

• Упростите тест, который у вас был в beforeShowDay(), чтобы добавить класс к дням между началом и концом включительно. Я понимаю, что вам может понадобиться немного больше, чем это (например, возможно, выделить дату начала, когда все это выбрано), но это самый простой случай, демонстрирующий рабочий пример.

• Добавленный базовый стиль для вашего класса .dp-highlight, должен был добавить дополнительную специфику, чтобы удостовериться, что он переопределяет стиль датпикера по умолчанию.

• Я также удалил несколько вещей, чтобы держать его просто:

  • дополнительные входы под инлайн DatePicker, я понимаю, вам, возможно, потребуется их для следующего шага, но это не имеет прямого отношения к этой проблеме;
  • inline datepicker onSelect код, опять же не имеющий прямого отношения к этой проблеме;