Полный календарь с добавлением привязки в пустые ячейки

Я использую Полный календарь Адама Шоу на своей странице бронирования.

Теперь я хочу настроить этот календарь таким образом, чтобы в каждой пустой ячейке была ссылка «Забронировать место». Щелчок по этому якорю должен открыть его в новой вкладке и взять дату этой ячейки в URL-адресе.

Вот мой код

$('.fc-day-number').each(function() {
   var day = parseInt($(this).html());
   $(this).html('<a href="http://www.example.com/booking.php?booking_date='booking date of the cell'" target="_blank">' + day + '</a>');
});

Пока я поставил якорь на дневной номер ячейки. Но проблема в том, что привязки исчезают, когда я меняю месяц с помощью кнопок «назад» и «вперед» плагина, и я не могу получить дату ячейки.

Я не эксперт в JS, любая помощь будет высоко оценена.


javascript arrays jquery fullcalendar fullcalendar-scheduler
person Muhammad Asif Raza    schedule 31.05.2016    source источник
comment
Вас интересует только ежемесячный просмотр?   -  person Patrick Roberts    schedule 31.05.2016

Ответы (1)


arrow_upward
0
arrow_downward

Попробуй это:

$('#calendar').fullCalendar({
  viewRender: function(view, $element) {
    $element.find('.fc-day-number').each(function() {
      var $this = $(this);
      var match = (/^(\d+)\-(\d+)\-(\d+)$/).exec($this.attr('data-date'));
      var date = new Date(+match[1], +match[2], +match[3]);

      $(this).wrapInner('<a href="http://www.example.com/booking.php?booking_date=' + encodeURIComponent(date.toUTCString()) + '" target="_blank"></a>');
    });
  }
});
<link href="http://fullcalendar.io/js/fullcalendar-2.7.2/fullcalendar.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
<script src="http://fullcalendar.io/js/fullcalendar-2.7.2/fullcalendar.min.js"></script>
<div id="calendar"></div>

person Patrick Roberts    schedule 31.05.2016