Touch Event not working in FullCalendar v.-3.9?

Question

I am using FullCalendar 3.9 version plugin for show Driver events. where click event is working on Desktop view but not in mobile device because on mobile phone touch event works. so how can i bind touch event on calendar and show data.

in fullCalendar({}) eventClick: i am using two method

$("#openFancybox").fancybox();
  $("#openFancybox").click();

so i want to fire those method on click. but it is not firing. also i removed all lines of method and just alert('test') but it is also not working. no error appearing what is reason i do not know?

My JS code

    $('#calendar').fullCalendar(
             eventClick: function (calEvent, jsEvent, view) {
                $(this).css('border-color', 'yellow');
                url = '{{ route("boking-details", 'XXX') }}'.replace('XXX', calEvent.booking_id);
                $.fancybox.destroy();
                element = '<a id="openFancybox"  data-type="ajax" data-src="' + url + '" href="javascript:;"></a>'
                $(".element").html(element);
                $("#openFancybox").fancybox();
                $("#openFancybox").click();
            },
            eventDrop: function(event, delta, revertFunc, jsEvent, ui, view) {
                if (confirm("This booking has now been moved."+ " with booking time " + event.start.format() )) {
                    changeBooking(event, delta, revertFunc);

                    //savedrop(event.id,event.start,event.end);    
                } else {
                    $('.popover').popover('hide');
                    revertFunc();
                }
            },

            eventRender: function(eventObj, $el) {
              $el.popover({
                title: eventObj.title,
                content: eventObj.description,
                trigger: 'hover',
                placement: 'top',
                container: 'body'
              });
            },
            timeFormat : "H(:mm)",
            //slotLabelFormat:"HH:mm",
            displayEventTime: false,
            //  now: '2018-11-07',
            editable: true, // enable draggable events
            dragRevertDuration: 1000,
            aspectRatio: 2.5,
            scrollTime: '10:00', // undo default 6am scrollTime
            slotDuration: '00:15:00',
            slotLabelInterval: 15,
            header: {
                left: 'today, prev,next',
                center: 'title',
                right: 'timelineMonth,timelineWeek,timelineDay'
            },
            defaultView: 'timelineMonth',
            views: {
                timelineThreeDays: {
                    type: 'timeline',
                    duration: {days: 3}
                },
                timelineWeek: {
                    type: 'timeline',
                    dayOfMonthFormat: 'ddd DD/MM',
                    //titleFormat: '(d MMMM yyyy)'
                    //titleFormat:"HH",
                },
                timelineDay: {
                    type: 'timeline',
                    //timeFormat: 'H:mm',
                    slotLabelFormat:"HH",
                }
            },
            resourceLabelText: 'Drivers & Companion',
            events: '{{route("all-driver-calender",["type"=>"bookings"])}}&driver_id='+getDriverIdFromURL(),
            resources:'{{route("all-driver-calender",["type"=>'driverName'])}}&driver_id='+getDriverIdFromURL()
        });
    });

Are you saying that fullCalendar's `eventClick` does not work, or that this command: `$("#openFancybox").click()` does not work? Your description is unclear. And if you're not sure which one is the problem, then what have you done to try and debug / narrow down the issue? We cannot execute your code, only you can do that. — ADyson, Jul 28 '21 at 06:58
Hi Adyson . i check this issue and it is not working if screen size is blow of **976px** approx on **mobile device** basically on small mobile device. here **eventClick()** function now triggering. so can you help me in this. — pankaj, Aug 07 '21 at 16:45

score 1 · Answer 1 · answered Aug 23 '21 at 19:25

1

I fixed my problem by setting . it is working FullCalendar v-3.9. now every button working on mobile that screen is very small like 560px (4Inch ,5inch etc).

width:800px,
height:600px,

answered Aug 23 '21 at 19:25

pankaj

1
17
36

Touch Event not working in FullCalendar v.-3.9?

1 Answers1