jQuery日期選擇器beforeShowDay

Question

我正在使用jQuery的datepicker beforeShowDay事件，在這裏我檢查日期是否必須在日曆中啓用。首先，我得到了使用PHP加載頁面的日期，但現在我想用ajax請求（我使用Wordpress）來獲取這些日期，但我無法弄清楚。

這裏是我的代碼：執行enableAllTheseDays功能

$(function() { 
    var enabledDays = [];   

    function openedDays() { 
     var data = { 
      action: 'get_dates', 
      zaal: <?php echo $zaal_id; ?>, 
      async: false, 
      dataType: 'json' 
     }; 

     $.getJSON(ajaxurl, data, function(response) { 
      $.each(response, function(key, value) { 
       enabledDays.push(value); 
      }); 
      //works, console.log(enabledDays) shows here an array of dates: ["9-8-2012","9-10-2012"] 

      //add option beforeShowDay to datepicker? (does't work yet) 
      $(this).datepicker('option','beforeShowDay',enableAllTheseDays); 

     }); 

    } 


    function enableAllTheseDays(date) { 
     //how to get value of the enabledDays variable in here 

     var m = date.getMonth(), d = date.getDate(), y = date.getFullYear(); 

     for (i = 0; i < enabledDays.length; i++) { 
      if($.inArray((m+1) + '-' + d + '-' + y,enabledDays) != -1) { 
       //return true(enable date in Current Days Open calendar) if date is in array, add class 'ui-datepicker-opened-day' and tooltip 'opened' to it. 
       return [true,'ui-datepicker-opened-day','opened']; 
      } 
     }    

     //return false(disable date in Current Days Open calendar) if date isn't in both of the arrays, and add tooltip 'closed' to it.  
     return [false,'ui-datepicker-closed-day','closed']; 

    } 


    //show Current Days Open Calendar 
     $("#currentdays").datepicker({ 
      dateFormat: "dd-MM-yy", 
      changeMonth: true, 
      numberOfMonths: 1, 
      minDate: 0, 
      beforeShow: openedDays 
     }); 

}); 

我需要找到一種方法，從openedDays功能得到日期，前，這樣我就可以在enableAllTheseDays功能使用enabledDays變量。

Answer 1

在onLoad（）函數中實例化datepicker一次，並定義當時的beforeShowDay()方法。每次顯示日期選擇器時都會調用beforeShowDay()，允許您每次迭代日期。

$(function(){ 
    $("your-selector").datepicker({ 
     beforeShowDay: function(date) { 
      // Either put the enable days code here (I prefer this route) 
      // or call it from here: return enableAllTheseDays(date); 
      // or define beforeShowDay as beforeShowDay: enableAllTheseDays. 
      // It will run each time the date picker is displayed. 
     } 
    }); 

    // Now setup your ajax call to load your dates into enabledDays 
    // Do not call datepicker again 
    $.getJSON(ajaxurl, data, function(response) { 
     $.each(response, function(key, value) { 
      enabledDays.push(value); 
     }); 
    }); 
});