JQuery: Datepicker Выделение диапазона дат

Question

Я программирую веб-приложение Struts с использованием JQuery 1.7 Datepicker на одном из моих jsps, чтобы реализовать календарь, который может подсвечивать напоминания для пользователя.

У меня вопрос:

Я бы хотел выделить диапазон дат в указателе даты.С моим кодом консоль Javascript не показывает ошибок, но диапазон дат не выделяется при входе в систему. Это моя функция:

$(function(){

            $('#datepicker').datepicker({
                flat: true,
                numberOfMonths: [1,1],
                dateFormat: 'dd/mm/yy',
                beforeShowDay: highlightDays
            });

У меня есть массив напоминаний, каждое напоминание имеет 3 атрибута,startDate, endDate и unit (связанный блок)

В событии beforeShowDay активируется функция highlightDays:

function highlightDays(date) {

     //For all reminders in the db
   for (var i = 0; i < reminders.length; i++) { 

    //If the current date in between the start and end date of reminder
      if( (new Date(reminders[i].start).getTime())  
                       <= date.getTime()                            
                      &&  (date.getTime())                           
                       <= (new Date(reminders[i].end).getTime()))  date
                { 
                  //Then highlight the current date             
                   return [true, 'ui-state-highlight',reminders[i].unit];

                }else{   //Otherwise do not highlight                          
                   return [true, ''];  
                }
           }          
      }

Есть ли у вас какие-либо мысли о том, что я могу делать неправильно?То, что я реализовал до сих пор, имеет смысл для меня, поэтому я не уверен, что может пойти не так.Буду очень признателен за руководство!

Большое спасибо за чтение!

Answer 1

Я сделал это успешно с помощью средства выбора даты для даты и средства выбора даты для даты, поэтому я изменил его для одного средства выбора даты. Вот код:

 $(function () {
            var today = new Date();
            var thisYear = (today).getFullYear();
            var fromDate = '1/1/2000'   //this is the initial from date to set the datepicker range
            var toDate = '1/7/2000' // this is the initial to date to set the datepicker range

//... initialize datepicker....
  },
  beforeShowDay: function(date){
        //if the date is in range
        if (date >= fromDate && date <= toDate) { 
           return [true, 'ui-individual-date', '']; //applies a css class to the range
         }
         else {
            return [true, '', ''];
          }
    },
   onSelect: function (dateText, obj) {

//sets the new range to be loaded on refresh call, assumes last click is the toDate              
     fromDate = toDate; 
     toDate = new Date(dateText); 

    $(".classDp1").datepicker("refresh"); 
    $(".classDp2").datepicker("refresh"); 
  },

Каждый раз, когда вы обновляете функцию beforeShowDay, вызывается с новыми диапазонами fromDate и toDate. Наличие переменных вне функции и их изменение внутри позволяет использовать подсветку из CSS для каждого клика.