FullCalendar dayClick not working (does nothing)

Question

I am trying to get the 'dayClick' function to work on FullCalendar, but when I press on any empty day, nothing happens. I have searched all over SO and cannot find any solutions or figure out what's going on.

Here is my code:

   $(document).ready(function () {
        $('#calendar').fullCalendar({
            header: {
                left: 'title',
                center: '',
                right: 'prev,next today'
            },
            defaultView: 'month',
            weekends: false,
            editable: false,
            selectable: true,
            events: "/Home/GetEvents/",

            eventClick: function (calEvent, jsEvent, view) {
                alert('You clicked on event id: ' + calEvent.id
                    + "\nSpecial ID: " + calEvent.someKey
                    + "\nAnd the title is: " + calEvent.title);

            },

            dayClick: function (date, jsEvent, view) {
                alert("Day Clicked");
                $('#eventDate').val($.fullCalendar.formatDate(date, 'dd/MM/yyyy'));
                ShowEventPopup(date);
            }
        });
    });

Answer 1

Only relevant for FullCalender v2:

I found that on my calendar the div with the class fc-bg was hidden by using display:none;. It turns out that this is what the dayClick event is attached to, and since it was hidden, I could not click on it.

The reason why the fc-bg class had been hidden was because of a print CSS that I included on the page. It turns out that it is super important that this stylesheet has media="print" on the link, otherwise it will always be used.

When including the FullCalendar CSS files on your page, ensure that the links are like this:

<link href="/css/vendor/fullcalendar.min.css" rel="stylesheet" />
<link href="/css/vendor/fullcalendar.print.css" media="print" rel="stylesheet" />

Answer 2

I used fullcalendar in company project ,when the table in below window view ,The dayClick not working, finally I find the css of "html{overflow-x:hidden}" result,I remove the css,it's ok.