I am working with AngularJS calendar (Which is essentially jQuery Full Calendar by Adam Shaw wrapped for angular). Here, the calendar event-item clicks worked both in ipad and desktop fine, until I brought in fastclick.js by ft labs (). Now, calendar event-item clicks works only on desktop, but not working at all on the ipad!

However, other ng-clicks work fine with fastclick both on desktop and iPad.

I understand how fastclick.js works by simply adding touch-end event listeners and calling click events within them, and cannot understand why this would fail with calendar event-item clicks.

Note: I tried using ngTouch instead of fastclick, but their, the ng-click doesn't bee fast. According to google, ngTouch's ng-click cannot be used with jQuery

I am working with AngularJS calendar (Which is essentially jQuery Full Calendar by Adam Shaw wrapped for angular). Here, the calendar event-item clicks worked both in ipad and desktop fine, until I brought in fastclick.js by ft labs (https://github./ftlabs/fastclick). Now, calendar event-item clicks works only on desktop, but not working at all on the ipad!

However, other ng-clicks work fine with fastclick both on desktop and iPad.

I understand how fastclick.js works by simply adding touch-end event listeners and calling click events within them, and cannot understand why this would fail with calendar event-item clicks.

Note: I tried using ngTouch instead of fastclick, but their, the ng-click doesn't bee fast. According to google, ngTouch's ng-click cannot be used with jQuery

• javascript
• jquery
• fullcalendar

• 7 Have you tried adding the needsclick class as specified in the fastclick documentation? – JoseM Commented May 23, 2014 at 14:41
• 2 Can you update with code samples? or fiddle? – dmcqu314 Commented Apr 5, 2015 at 17:50
• Where did you include the JS? Try to include in the header before anything else. – wintercounter Commented Apr 20, 2015 at 11:05
• I remend to use vclick from jquery mobile – Marius Commented Apr 30, 2015 at 10:14
• While I have not specifically tried what you are doing, I have had fun with events. When you bind events, they are cumulative unless you unbind previous bindings for a given event. This can produce unexpected results if you're not careful. Another thing, if you bind to a top level DOM element, your clicks (and I guess touches) should bubble up. I use this for plex grids as it reduces bindings and memory use and improves overall performance. Good luck! – J E Carter II Commented Jun 1, 2015 at 18:43

3 Answers 3

if all else fails you can inspect which events are linked to your elements with visual event: http://www.sprymedia.co.uk/article/visual+event This adds an overlayer to any web page and let you visually inspect the JS code that's linked to an element (it shows you the piece of code in a pop up).

this way you can easily see if everything is set up correctly.

PS: I have no link to this tool or it's makers.

I had similar issue. fastclickjs blocks every jQuery .click() . But if you dispatch event without jQuery everything works fine.

Well this is an old question, but maybe it helps somebody.

I had a similar problem, and even fastclick.js didn't help and wasn't fast enough on the iPad.

The problem is that on a normal browser click event (on an iPad) has a delay of 300ms on touchstart and again 300ms on touchend.

fastclick.js also had some conflicts like yours with the calendar.

So i just wrote an own directive and called it ng-mobile-click.

Directive ngMobileClick:

App.directive("ngMobileClick", [function () {
    return function (scope, elem, attrs) {
        elem.bind("touchstart click", function (e) {
            e.preventDefault();
            e.stopPropagation();

            scope.$apply( attrs["ngMobileClick"] );
        });
    }
}]);

Usage in templates:

<input type="button" value="somevalue" ng-mobile-click="someFunction(someParam)"/>

Advantage: Will never conflict with standard click events.

Disadvantage You have to refactor your code where you need it