BackButton fires without firing click event

[Kerry]

When I click a data-role="backbutton" button and move just a little bit as I click, the BackButton navigates back but the attached click event calling my code does not fire.

Steps to reproduce:
http://plnkr.co/edit/XzaXgNzODJqgqdVHANKb?p=preview

1. Click on the Find tab control entry (2nd one on the bottom)
2. Click on the Filter button in top right hand corner
3. Click on the "Floors" item (next to last)
4. Click on a few floors.  Check box will be displayed on right.
5. Click on the "Filter" button in top left hand to go back to Filter view.
6. When back on the "Filter" view it "should" show the number of floors selected.

In step 5 above, if you drag a little bit when you click the back button will fire but the attached click event calling my code is not fired and the number of floors selected will not be displayed properly on the "Filter" view.

I have recorded a video of this plunker recreating the problem on an iPad Air:
http://youtu.be/fJmgikqhdEQ

[Kiril Nikolov]

Hi Kerry,

The problem comes from the fact that when you swipe to the right, the click on the back button is not fired, but the browsers back swipe gesture is activated and you basically navigate to the previous view without pressing the "Filter" button. This swipe gesture has been introduced with the iOS7 release and I am afraid that Kendo UI does not have a way to prevent it.

Regards,
Kiril Nikolov
Telerik

 

 

[Kerry]

This same behavior can be reproduced in Chrome and IE on the desktop.  I don't believe that it is the swipe gesture that is causing this behavior.  I can click and drag a little to the right on the button and the same action occurs.  

This is a MAJOR problem for usability.

I would appreciate any workarounds.

[Kiril Nikolov]

Hello Kerry,

After further investigation it turns out that the back button listens for two different events for the click event and the navigate back event and causes the problem. If you do not use the back button, and navigate manually using the navigate() method of application, then this problem is not longer there. Here is the workaround:

http://jsbin.com/yayal/1/edit

Regards,
Kiril Nikolov
Telerik

 

 

[Kerry]

Thank you very much for the work around.

[Kiril Nikolov]

Hi Kerry,

I am glad it helped. 

Please do not hesitate to contact us, if any questions arise. 

Regards,
Kiril Nikolov
Telerik