Выберите только определенные даты в jQuery UI datepicker (список дат поступает из AJAX) - PullRequest
Новая
       13

Выберите только определенные даты в jQuery UI datepicker (список дат поступает из AJAX)

6 голосов
/ 28 февраля 2012

Здесь я отправляю идентификатор фильма и получаю доступные дни, и я хочу установить его в календаре.но он не работает и отключает все даты.Из PHP он возвращает строку даты.Строка даты идет правильно, но календарь не работает.Пожалуйста, помогите.

Пример строки даты 

"28-02-2012","29-02-2012","01-03-2012","02-03-2012","03-03-2012","04-03-2012","05-03-2012","06-03-2012","07-03-2012","08-03-2012","09-03-2012","28-02-2012","29-02-2012","01-03-2012","02-03-2012","03-03-2012","04-03-2012","05-03-2012","06-03-2012","07-03-2012","08-03-2012","09-03-2012"

Код 

jQuery.post('index.php', {
  'option': 'com_movie',
  'controller': 'reservation',
  'task': 'datelist',
  'format': 'raw',
  'mid': movieid
}, function(result) {
  var onlydates = result.split(',');
  jQuery("#datepicker").datepicker({
    dateFormat: 'yy-mm-dd',
    showOn: "button",
    buttonImage: "<?php echo IMAGES_LINK.'calendar.png';?>",
    buttonImageOnly: true,
    beforeShowDay: function(date) {
      dmy = date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear();
      console.log(dmy + ' : ' + (jQuery.inArray(dmy, onlydates)));
      if (jQuery.inArray(dmy, onlydates) != -1) {
        return [true, "", "Available"];
      } else {
        return [false, "", "unAvailable"];
      }
    }
  });
  return;
});

1 Ответ

12 голосов
/ 28 февраля 2012
  • Инициализировать сборщик данных только один раз; сказать ему, чтобы он выбирал действительные даты из глобального массива
  • Инициализировать глобальный массив, используя литерал массива, обновлять его через AJAX при необходимости
  • Вызывать метод .datepicker("refresh") каждый раз, когда изменяются отключенные / включенные даты - т.е. когда вы получаете новые результаты через AJAX
  • Ваш код не добавляет начальные нули к датам, поэтому $.inArray не будет работать должным образом 
var datelist = []; // initialize empty array

$("#datepicker").datepicker({
    beforeShowDay: function(d) {
        // normalize the date for searching in array
        var dmy = "";
        dmy += ("00" + d.getDate()).slice(-2) + "-";
        dmy += ("00" + (d.getMonth() + 1)).slice(-2) + "-";
        dmy += d.getFullYear();
        return [$.inArray(dmy, datelist) >= 0 ? true : false, ""];
    }
});

$("#button").click(function() {
    datelist = []; // empty the array
    $.post("/echo/html/", {
        // parameters here
    }, function() {
        var result = "28-02-2012,29-02-2012,01-03-2012,02-03-2012,03-03-2012,04-03-2012,05-03-2012,06-03-2012,07-03-2012,08-03-2012,09-03-2012,28-02-2012,29-02-2012,01-03-2012,02-03-2012,03-03-2012,04-03-2012,05-03-2012,06-03-2012,07-03-2012,08-03-2012,09-03-2012"; // dummy result
        datelist = result.split(","); // populate the array
        $("#datepicker").datepicker("refresh"); // tell datepicker that it needs to draw itself again
    });

Демо здесь

...