Как перезагрузить данные в jQuery-UI Datepicker? - PullRequest
Новая
       13

Как перезагрузить данные в jQuery-UI Datepicker?

1 голос
/ 16 ноября 2011

Вот ситуация:

У меня есть средство выбора даты JQuery-UI с переданными данными из запроса jjery ajax. 

$(document).ready(function() {

$.ajax({
  url: "load-calendar",
  dataType: "json",
  success: function(calendarEvents){

         $("#calendar_1").datepicker({
            beforeShowDay: function(date) {
               var m = date.getMonth(), d = date.getDate(), y = date.getFullYear();
               for (i = 0; i < calendarEvents.length; i++) {
                   if($.inArray(y + '-' + (m+1) + '-' + d,calendarEvents) != -1) {
                       return [true, 'ui-state-busy', false];
                   }
               }
               return [true];

           }

          });
  }
});

});

Работает нормально, и я вижу календарь с выделенными занятыми днями.

Теперь я хотел бы автоматически обновлять этот календарь (каждую минуту), чтобы пользователь мог автоматически видеть новые выделенные дни. Это возможно?

Я пытался использовать функцию setInterval , но безуспешно.

Так что любые впечатления / идеи приветствуются. Заранее спасибо.

Ответы [ 2 ]

0 голосов
/ 17 ноября 2011

Я решил эту проблему: 

<div id="show_calendars"></div>

$(document).ready(function() {

   var update = function(){
        $('#show_calendars')
             .load('/reload-calendars')
             .fadeIn("slow");
   };
   var auto_refresh = setInterval(function(){update();}, 10000);
   update();

});

Функция Перезагрузка-календари : 

<div id="calendar_1"></div>

$(document).ready(function() {

var busyDays = [<? echo $data;?>];
var date = new Date();

 $( "#calendar_1").datepicker({
     dateFormat: 'yy-mm-dd',
     beforeShowDay: function(date) {
         var m = date.getMonth(), d = date.getDate(), y = date.getFullYear();
         for (i = 0; i < busyDays.length; i++) {
             if($.inArray(y + '-' + (m+1) + '-' + d,busyDays) != -1) {
                 return [true, 'ui-state-busy', false];
             }
         }
         return [true];
     }

 });

});
0 голосов
/ 16 ноября 2011

Если ваш ajax-ответ достаточно быстр, вы можете сделать этот вызов в событии beforeShow средства выбора даты: 

$('#calendar_1').datepicker({
   beforeShow: function(input, inst) { //code to update calandar events here// }
});

При использовании встроенного DatePicker: 

function refreshDatePicker(){
    //your ajax call here
}

$(function(){
   // Document is ready
   setInterval ( "refreshDatePicker()", 1000 );
 });
...