Handle single and double click events in fullcalendar

Question

I am using fullcalendar and on single click to particular day of calendar it should fire single click event and on double click it should fire double click event.But on page load when I click 1st time it is not responding and single/double click not working properly.

/* config object */
            $scope.uiConfig = {
              calendar:{
                height: 450,
                editable: false,
                    defaultView: 'month',
                    columnFormat: {
                        month: 'ddd',
                        week: 'ddd dd/MM',
                        day: 'dddd M/d'
                    },
                buttonText: {
                        month: "Mois",
                        week: "Semaine",
                        day: "Jour",
                        today:"aujourd'hui",
                },
                eventClick: $scope.alertEventOnClick,
              }
            };


$scope.alertEventOnClick = function(calEvent, jsEvent, view) {


                $("#onClick").click(function (e) {
                    var $this = $(this);
                    if ($this.hasClass('clicked')){
                        $this.removeClass('clicked'); 

                         //perform double-click action  
                    }else{
                         $this.addClass('clicked');
                         setTimeout(function() { 
                             if ($this.hasClass('clicked')){
                                 $this.removeClass('clicked'); 

                                  //perform single-click action    
                             }
                         },10);          
                    }
                });

        };

Answer 1

Use fullCalendar eventRender callback to attach your own events.

For example:

$('#calendar').fullCalendar({
    //events: [
        //....
    //],
    eventRender: function(event, element) {
         $(element).on({
             click: function() {
                 // Handle click...
             },
             dblclick: function() {
                 // Handle double click...
             }
         });
    }
});