CODEWITHSUNDEEP
javascriptcssfullcalendar
Jev Mokrousov
Jev Mokrousov

Reputation: 161

FullCalendar dayClick not triggering

I had issue when dayClick function was't triggering on page with scroll for some cells and it was fine for others. Basically it was fine on page without scroll, but on longer content having page it cause problem.

Upvotes: 1

Views: 1046

Answers (2)

sandre89
sandre89

Reputation: 5908

The current fix is to remove overflow-x: hidden from the HTML element. Its a known issue: https://github.com/fullcalendar/fullcalendar/issues/3615

Upvotes: 0

Jev Mokrousov
Jev Mokrousov

Reputation: 161

What I have found out is that there is two functions to define cell position in grid ( fullcalendar 2.5.0 version):

'getHorizontalIndex' and 'getVerticalIndex'

Function 'getVerticalIndex' return 'undefined' because mouse 'topOffset' position was out of 'boundingRect' dimensions, so after digging deeper I found out function 'getScrollParent' (line 297) which is responsible for finding top parent element.

function getScrollParent(el) {
    var position = el.css('position');
    var scrollParent = el.parents().filter(function() {
        var parent = $(this);
        return (/(auto|scroll)/).test(
            parent.css('overflow') + parent.css('overflow-y') + parent.css('overflow-x')
        );
    }).eq(0);

    return position === 'fixed' || !scrollParent.length ? $(el[0].ownerDocument || document) : scrollParent;
}

and because in my css were no elements with css 'overflow:scroll' or 'overflow:auto' my parent element was 'html' which height was detected as height without scroll. Solution was simple - specify 'overflow:auto;' in css for calendar element. For example, if you have code like:

<div id="mycalendar"></div>

(function(){
    $("#mycalendar").fullCalendar({});
})();

add style 'overflow:auto;' for 'mycalendar' div.

Upvotes: 3

Related Questions