{{action}} handler does not work on touch devices

[redeemedfadi]

Adding an {{action}} helper to a tag and clicking that tag on a touch enabled device (tested on iOS) will not fire the attached event.

See: http://jsfiddle.net/Jwm46/4/

I understand that by default the {{action}} uses on="click". However, the "click" action should probably fire/receive the touchEnd event on touch devices.

[redeemedfadi]

Discovered I can overwrite the touchend event by browsing the source. Not really a perfect solution but this fixed my problem: http://jsfiddle.net/Jwm46/5/

[manoharank]

@wagenet I also have the same problem, what would be the best solution for this?

[mattkime]

i'm using ember with jQuery Mobile and don't suffer from this issue. I'm not sure why but it might be worth digging through the jQM source.

[krisselden]

This is an iOS problem with the event delegation pattern. Here is a working fiddle with 2 simple solutions.

http://jsfiddle.net/krisselden/Jwm46/6/

[krisselden]

A little more explanation, click is only synthesized if the element is or is contained by an element with default click behavior (anchor with a href or a button), has a click handler (not including the body), or is styled with cursor: pointer.

Also the body tag is the only element that can delegate click events without being 'clickable' itself (so you are going to have a bad time if you make the rootElement of your Ember.Application an element other than the body).

Also, there is an subtle issue with using touchend to trigger actions, since the iOS browser will synthesize a click event 300ms later and deliver it to element in the same area, even if it isn't the original element that had touchend, if it is a plain a tag with href it will cause it to navigate.

So say you had a list of links that acted on touchend to render a detail view, and in the detail view was a link to google maps rendered in about the same place as the link in the list view, you would cause the link to be followed when you selected the list item.

Google calls this a 'ghost click' in this paper https://developers.google.com/mobile/articles/fast_buttons