List items "clicking" when scrolling (1.0 Beta)

[taylorotwell]

When trying to scroll a list of items, I am often frequently taken into a list item's detail view because the "click" event accidently fired when scrolling. This makes scrolling pretty annoying since I am often just randomly taken into items. I don't remember noticing this before 1.0 Beta but could be wrong.

Also reported by others:

http://forum.ionicframework.com/t/enters-list-items-when-try-to-scroll-through-list/2309

http://forum.ionicframework.com/t/how-to-scroll-without-accidently-clicking-list-items/2466/5

[adamdbradley]

Related: #970

[mhartington]

@adamdbradley possibly related too.

http://forum.ionicframework.com/t/facing-problem-on-scrolling/2399/4

Seems there are issues with text input as users try to scroll. I tried wrapping the inputs with a specific label (not the best of practice but can work in some cases) but still not luck.

 <label class="item item-input" for="firstName">
     <input id="firstName" type="text" placeholder="First Name">
</label>

[adamdbradley]

I'm currently working on a few solutions and hopefully have something posted soon, thanks.

[rvanbaalen]

Could this be related to the issue where form fields steal focus when
scrolling through long forms on iOS?

Related: #931

[mhartington]

I haven't played with it much but it could be @rvanbaalen. There's been some post on the forum that have been reporting the clicking issue and fields stealing focus. Maybe something to do with #791?

[adamdbradley]

I just committed a change where it's no longer testing against the mousedown event, which is where the primary issue was coming from. (Why older Android touch devices broadcast both touch and mouse events is beyond me).

f3bd258#diff-f2135b81b6b1a2b40fa3998c02a80a4fL135

I've tested my fixes on iOS7, desktop chrome (both mouse and with touch events enabled), Android 4.2, and Android 2.3, but I haven't closed this issue yet. Would I be able to get some additional help testing? Thanks.

http://code.ionicframework.com/#nightly (build 1512 or later)

[rvanbaalen]

I'll update and test it on iOS7.1 now. This should fix the issue I addressed in my previous comment regarding the input fields stealing focus when trying to scroll? From the looks of your comment (regarding the 'mousedown' event) it seems like this is the case.

[taylorotwell]

I can confirm the scrolling is fixed for me on iOS 7.1. Although on my login screen I kept trying to click on password and it would focus but then immediately lose focus. After a while of clicking it and messing around I finally got it to keep focus so I could enter my password.

[mhartington]

Everything looks good with list items, but text inputs are still a bit problematic.
If you try to scroll around on text inputs, it will catch one of them.

http://codepen.io/mhartington/pen/rnhgd

[rvanbaalen]

Yeah the input fields issue is still ongoing.

[ajoslin]

OK, will probably just revert the change then. Let's open a new issue #1012

[adamdbradley]

Ok I made another change to not ignore a scroll touchstart if the targe was an input (build 1517 or later)

[mhartington]

@adamdbradley I think things are good. I tested on the codepen I posted earlier and it seems to work. I'll try on an actual device in the morning.

[ftorre104]

I have unwanted clicks while scrolling a list. Sorry for the newbie question, but how can I update my current ionic project to test this fix?

Nevermind! Got it. Just dowloaded the newest files from http://code.ionicframework.com/#nightly and replaced them in my project. My problem seems to be fixed. Thanks!

[CoenWarmer]

All good! Please consider asking in the forum first before opening up an issue on Github. :)

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.