touch triggers through multiple layers

6 posts, 2 answers
  1. Answer
    Michael
    Michael avatar
    151 posts
    Member since:
    Jan 2012

    Posted 10 Oct 2013 Link to this post

    I have a basic test app running. It contains a landing page with an image on it and a button below the image. If you click the image, an alert pops up. If you click the button, a modal view pops up. The trouble is, when you click "close" on the modal, it triggers the alert event for the image (as long as you touch the part of the button that overlays the image in the background). This appears to be true for any kind of popover layer view.

    I am testing on an android 4x device through ICENIUM. It runs fine in the simulator.

    Anything to do about this?

    Thanks
  2. Petyo
    Admin
    Petyo avatar
    2444 posts

    Posted 14 Oct 2013 Link to this post

    Hi Michael,

    the underlying reason for this is the delayed click event on touch devices, which is present both in iOS and Android. The android implementation is buggier, though. My guess is that the underlying image has the callback bound on the click event, while all Kendo UI Mobile widgets use the touchend event. If this is so, you can try moving the callback to the touchend event, and see if the problem persists.

    Regards,
    Petyo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Michael
    Michael avatar
    151 posts
    Member since:
    Jan 2012

    Posted 14 Oct 2013 Link to this post

    Hi Petyo,

    Thanks for the reply.

    For the image we have, "...data-bind="click: onButton"..."

    The modal uses, "...data-click="closeModal"..."

    How would I implement the touchend event for the image?

    Thanks
  4. Michael
    Michael avatar
    151 posts
    Member since:
    Jan 2012

    Posted 14 Oct 2013 Link to this post

    I think "...data-click="onButton"..." did the trick.
  5. Petyo
    Admin
    Petyo avatar
    2444 posts

    Posted 15 Oct 2013 Link to this post

    Hello Michael,

    I can confirm this approach. Another option would be something like data-bind="events: { touchend: onButton}".

    Regards,
    Petyo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Answer
    Michael
    Michael avatar
    151 posts
    Member since:
    Jan 2012

    Posted 15 Oct 2013 Link to this post

    I added a few views, and made various seemingly unrelated modifications to the app and the approach I was using stopped working, actually. Your solution still works, though.
Back to Top