How to get the date when calendar rendering date cells

问题

I've a situation where I need to get the date to attach in each event url (For event url's I'm adding the href attr using jquery) query string but after checking the docs I found both eventClick and eventRender do not returns the date of cell upon which event is showing.

I tried google for it and found tricky solutions using the eventClick callback and use page X and Y and then get the nearest element which holds the data attribute with date for the particular cell date but

eventClick:function(event,jsEvent,view){
var clickedDate = $.nearest({x: jsEvent.pageX, y: jsEvent.pageY}, '.fc-day').attr('data-date');
alert(clickedDate);
}

But this solutions fails when I've multiple event on the same date cell and more events will be shown in a popup.

Note : $.nearest is the jquery plugin to find the nearest element from given X,Y postions

Note : I'm using v2

回答1:

Does this work sufficiently well for you?

http://jsfiddle.net/3E8nk/531/

$('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    defaultDate: '2014-06-12',
    editable: true,
    eventRender: function(event, element, view) {

        var start = event.start.clone().startOf('day');
        var end = event.end ? event.end.clone().endOf('day') : start.clone().endOf('day');

        //Known bug: We get all "touching" events and not just necessarily events on the day we clicked

        var events = $('#calendar').fullCalendar('clientEvents');

        var touchingEvents = events.filter(function(event) {
            var
                eventStartWithin = event.start.isWithin(start, end),
                eventEndWithin = event.end ? event.end.isWithin(start, end) : false;
            return eventStartWithin || eventEndWithin;
        });

        console.log(touchingEvents);

    },
    events: [
        {
            title: 'All Day Event',
            start: '2014-06-01'
        },
        {
            title: 'Long Event',
            start: '2014-06-07',
            end: '2014-06-10'
        },
        {
            id: 999,
            title: 'Repeating Event',
            start: '2014-06-09T16:00:00'
        },
        {
            id: 999,
            title: 'Repeating Event',
            start: '2014-06-16T16:00:00'
        },
        {
            title: 'Meeting',
            start: '2014-06-12T10:30:00',
            end: '2014-06-12T12:30:00'
        },
        {
            title: 'Lunch',
            start: '2014-06-12T12:00:00'
        },
        {
            title: 'Birthday Party',
            start: '2014-06-13T07:00:00'
        },
        {
            title: 'Click for Google',
            url: 'http://google.com/',
            start: '2014-06-28'
        }
    ]
});

来源：https://stackoverflow.com/questions/26278724/how-to-get-the-date-when-calendar-rendering-date-cells

标签

fullcalendar