Заменить номер дня со ссылкой на событие в jQuery Fullcalendar

Question

Я использую jQuery Fullcalendar от arshaw.com/fullcalendar/, и я хотел бы заменить номер дня ссылкой на событие, которое я получаю через JSON из базы данных, например на this image:

У меня есть небольшой календарь с одним событием в день, поэтому для меня не требуется отображение по умолчанию. Мне нужно что-то более простое и чистое.

Поскольку я не очень хорошо знаком с jQuery, я не могу понять это сам.

Есть ли способ, чтобы заменить это:

<div class="fc-day-number">5</div> 

со ссылкой на события в этот день?

Answer 1

Без изменения исходного кода сценария создания календаря вы можете добиться желаемого результата с небольшим взломом. Предположим, у вас есть объект JavaScript, который содержит ваши URL-адреса событий, как это:

var urls = { 
    4: "http://mydomain.com/event.html", 
    16: "http://mydomain.com/event2.html", 
    22: "http://mydomain.com/event.html" 
} 

Это может быть результатом запроса JSON. Вы можете перебрать все дни в календаре и проверьте, есть ли ссылка на этот день, а затем обновить номер дня, чтобы содержать ссылку:

$('.fc-day-number').each(function() { 
    // Get current day 
    var day = parseInt($(this).html()); 

    // Check if there's a url defined for the day 
    if(urls[day] != undefined) { 
     // Replace the day number with the link 
     $(this).html('<a href="' + urls[day] + '">' + day + '</a>'); 
    } 
}); 

Просто бежать, что фрагмент кода каждый раз, когда календарь загружается/открыт , Не зная больше о календаре, невозможно сказать, где именно этот фрагмент должен быть точно расположен.

Answer 2

Вам просто нужно сделать быструю модификацию в ваш fullcalendar.js

• Добавления ссылки на создании
• Добавления ссылки в клеточках перерисовывать вещи ..

Просто замените эта линия:

(showNumbers ? "<div class='fc-day-number'>" + d.getDate() + "</div>" : '') + 

с этой строкой:

(showNumbers ? "<div class='fc-day-number'><a href=\"myURL.com\">" + d.getDate() + "</a></div>" : '') + 

, а затем эта линия:

td.find('div.fc-day-number').text(d.getDate()); 

с этой линии:

td.find('div.fc-day-number').html("<a href=\"myURL.com\">"+d.getDate()+"<a\>"); 

Наслаждайтесь;)

Foo.