Search code examples
javascriptjqueryfullcalendarfullcalendar-2

Fullcalendar handle double click


I'm using fullcalendar for my calendar functionality. I'm using dayClick and select. In fullcalendar, select will be called even though it is a single day click. So, I changed the dayClick event like below to handle the day click. Here is my code

dayClick: function(date, jsEvent, view) {
    isClicked = true;
},
select: function(startDate, endDate){
    if(isClicked){
        console.log('click');
        return;
    }
    var start_date = moment(startDate).format('Y-MM-DD');
    var end_date = moment(endDate).format('Y-MM-DD');
    if(start_date != end_date){
        end_date = moment(endDate).subtract(1, 'days').format('Y-MM-DD');
    }

    var set_default_duration = isClicked == true ? true : false ;
    isClicked = false;

    var user = $(t).attr('data-code');
    // Some other stuff
 },

Actually, I want to handle double click to create new events. I tried with dblclick event function from jquery with the calendar but always single click only triggers. The problem is, immediately after the click made, select is fired, so I'm unable to handle the double click. Can someone help me to handle the double click in this case.

Here is the Fiddle

EDIT: I'm trying to handle double click of the empty slots to create new event. Currently, single click is doing this


Solution

  • I found the answer. The problem is with the selection. It is selected once the day is clicked. So, I used unselect method to clear the selection and it seems fine now. Here is the code

    dayClick: function(date, jsEvent, view) {
        if(isClicked){
            isDblClicked = true;
            isClicked = false;
        }
        else{
            isClicked = true;
        }
        setTimeout(function(){
            isClicked = false;
        }, 250);
     },
     select: function(startDate, endDate, jsEvent){
        if(isClicked){
            $(t).fullCalendar('unselect');
            return;
        }
        // Other stuff
    }