Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

ngClick and checkboxes receiving double clicks on touch devices when jquery is included #1842

Closed
FrankMeyer opened this issue Mar 9, 2015 · 10 comments
Assignees
Milestone

Comments

@FrankMeyer
Copy link
Contributor

md-checkbox and ng-click are behaving strange on touch-devices when jQuery is included.
Without jQuery all works fine.
Here is an example with angularJS 1.3.14 and angular-material 0.8.3:
http://codepen.io/anon/pen/qEMJXo
The Button clicks will count twice and the md-checkbox is barely checkable.
Testet on Galaxy S4 with android standard browser and on a Motorola Tablet with Chrome and Firefox.
I also tried to include ngTouch,hammer.js and jQuery-mobile. Neither helped.
It seems that angular elements receive double clicks all the time.

Dropping jQuery is not an option, as it will be used widely in the underlying project.
Anyone have a clue why jquery brings such behaviour?
Or am I missing something?

@MilosStanic
Copy link

Hey, this is the same issue I'm having on desktop Windows Chrome with mdSidenav. When I click open the button gets clicked twice so my sidenav closes immediately after opening. Didn't try without JQuery.

@ducva
Copy link

ducva commented Mar 9, 2015

I got same issue, and fixed by removing window.jQuery at line 1058 in angular-material.js

if (window.jQuery || isKeyClick || ev.$material) return;

@MilosStanic
Copy link

I can also confirm doubleclicks happening on buttons in mdSidenav and mdBottomSheet.

FrankMeyer added a commit to FrankMeyer/material that referenced this issue Mar 10, 2015
…y is loaded

	Remove window.jQuery from check for hijacking clicks on mobile devices.
	Touch clicks were emitted twice when jQuery was loaded which made checkboxes and buttons unusable on mobile devices.

	Addressing Issue angular#1842 Utilizing proposed fix
FrankMeyer added a commit to FrankMeyer/material that referenced this issue Mar 11, 2015
…y is loaded

	Remove window.jQuery from check for hijacking clicks on mobile devices.
	Touch clicks were emitted twice when jQuery was loaded which made checkboxes and buttons unusable on mobile devices.

	Addressing Issue angular#1842 Utilizing proposed fix
@ThomasBurleson ThomasBurleson modified the milestone: 0.9.0 Mar 11, 2015
ThomasBurleson pushed a commit that referenced this issue Mar 11, 2015
…y is loaded

Remove window.jQuery from check for hijacking clicks on mobile devices.
Touch clicks were emitted twice when jQuery was loaded which made checkboxes and buttons unusable on mobile devices.

Addressing Issue #1842 Utilizing proposed fix

Closes #1869, #1842.
@ThomasBurleson
Copy link
Contributor

Closed with SHA 81bcf7f

@mathiasmoeller
Copy link

@ThomasBurleson I still have the same problems using touch devices. In my case its with md-switch and toggle buttons. I included the latest version of material (latest commit: 4e3a25b) but the bug is still there. Any ideas what the problem could be?

I think the problem is related to #1841 (as i have the problems with the sidenav as well) but as you closed this issue here the bug should already be resolved?

@gharel
Copy link

gharel commented Apr 8, 2015

I have the same problem on : md-sidenav and md-switch.
Like @mathiasmoeller said maybe the same problem than #1841.
I use jQuery UI and it need jQuery to be load before Angular, maybe this could help.
Thanks.

@kennethcachia
Copy link
Contributor

@gharel @mathiasmoeller

Can you test http://codepen.io/kennethcachia/pen/dPBPxq and let me know if you're still experiencing this issue?

It works for me on both Android and iOS and I want to confirm if it's resolved or if it's a possible conflict with ionic.

Thanks!

@ThomasBurleson
Copy link
Contributor

Fixed in 2de0cf2

@gharel
Copy link

gharel commented Apr 9, 2015

It works for me on iOS. Thank you.
So it solved the problem for md-switch, what about md-sidenav ?
Thanks in advance.

@mathiasmoeller
Copy link

Did not have the time to test it completely but it seems to work! Thank you very much!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

8 participants