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

Question

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

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

Так как я не очень знаком с 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.