Datepicker onchangemonthyear beforeshowday

Question

У меня есть datepicker на модальном twitter bootstrap. , чтобы выделить некоторые даты, датапикер генерируется в части «success» как ajax-call.

Мне удалось выделить даты, которые я хочу выделить в текущем месяце, и это нормально.

Но когда я переключаюсь на предыдущий или следующий месяц, я хотел бы снова сделать этот ajax-вызов и отобразить даты для выделения. Ниже вы можете увидеть мой код:

function nonValidated() {   

     var date = new Date(); 
     date.addDays(-date.getDate() + 1); 
     var startDate = [date.getDate().lpad(2), (date.getMonth() + 1).lpad(2), date.getFullYear()].join('/'); 
     var enddate = new Date(); 
     enddate.setDate(date.getDaysInMonth()); 
     var endDate = [enddate.getDate().lpad(2), (enddate.getMonth() + 1).lpad(2), enddate.getFullYear()].join('/'); 
     var depId = $('#serviceSelector').val(); 


     $.ajax({ 
      type: "POST", 
      url: "/ServiceManagement/GetUnassignedSlots", 
      data: { "from": startDate, "to": endDate, "depId": depId }, 
      success: function (data) { 
       $.datepicker.setDefaults(
        $.extend(
        { 'dateFormat': 'dd/mm/yy' }, 
        $.datepicker.regional['nl-BE'] 
       ) 
       ); 
       $("#nonValidatedDatepicker").datepicker(
        { 
         inline: true, 
         beforeShowDay: function (date) { 

          var theday = date.getDate() + '/' + 
          (date.getMonth() + 1).lpad(2) + '/' + 
          date.getFullYear(); 
          return [true, $.inArray(theday, data.result) >= 0 ? "warningDate" : '']; 
         }, 
         onSelect: function (dateText, inst) { 
          var dateParts = dateText.split('/'); 
          if (dateParts[0][0] == '0') dateParts[0] = dateParts[0][1]; 
          if (dateParts[1][0] == '0') dateParts[1] = dateParts[1][1]; 
          var newdate = new Date(dateParts[2], dateParts[0]-1, dateParts[1]); 

          var dayOfWeek = newdate.getDay(); 
          if (dayOfWeek == 0) dayOfWeek = 7; 
          var weekstart = new Date(newdate.getFullYear(), newdate.getMonth(), newdate.getDate()); 
          weekstart.addDays(-dayOfWeek + 1); 
          var weekend = new Date(newdate.getFullYear(), newdate.getMonth(), newdate.getDate()); 
          weekend.addDays(7 - dayOfWeek); 

          $('#SelectWeekDate').val([weekstart.getDate().lpad(2), (weekstart.getMonth() + 1).lpad(2), weekstart.getFullYear()].join('/') + ' - ' + [weekend.getDate().lpad(2), (weekend.getMonth() + 1).lpad(2), weekend.getFullYear()].join('/')); 
          $('#modalNonValidated').modal('hide'); 
          InitFillPage(); 
         }, 
         onChangeMonthYear: function (year, month, widget) { 


         } 
        } 
        ); 

      }, 
      error: function (data) { 
      }, 
      statusCode: { 
       401: function (data) { 
        //ERROR 401: Unauthenticated 
        window.location.href = '/Account/Login?ReturnUrl=' + encodeURIComponent(window.location.pathname); 
       } 
      } 
     }); 
    } 

кого идея, как я могу объединить onchangemonthyear и beforeshowday?

Answer 1

Я бы разделил код, который показывает дату и код, который заставляет вызов ajax получать данные для datepicker (данные, которые определяют, какие дни выделять) на 2 отдельные функции. Вы можете вызвать функцию, которая делает вызов ajax функцией, которая сначала показывает датупиксера, и снова из вашей функции onChangeMonthYear. Кроме того, убедитесь, что вызов ajax для получения данных производится синхронно (установите параметр async: false), чтобы данные возвращались до запуска функции beforeShowDay.

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