Scrolling not possible in FilteringSelect drop down on mobile devices (iPad/Android pad)

[Alexander Kläser]

I observed that it is not possible to scroll in the drop down menu of a FilteringSelect? / ComboBox? widget. This can be seen testing on the following page:

​http://archive.dojotoolkit.org/nightly/dojotoolkit/dijit/tests/form/mobile.html

This applies to the iPad as well as an Asus Transformer Pad (→ running Android). Otherwise the handling of the focus (and keyboard) seems to be fine :) .

[bill]

Good catch.

Doug, this is from the evt.preventDefault() call in _ListBase.js. I can get scrolling to work on iPad by changing:

evt.preventDefault();

to:

if(evt.type != "touchstart"){ evt.preventDefault(); }

Not sure if that change is OK or not though. I'm guessing the preventDefault() call is just to prevent an (unwanted) screen jump on desktop, but I'm not sure.

[doughays-dojo <[email protected]…>]

In 0482b557c761cdd96a640123bfb86200f667797c/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[doughays-dojo <[email protected]…>]

In ee63d723736ca7468a05e8df8459a352de9e0eca/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Alexander Kläser]

Thanks for the fast response! I checked the current built. On both pads I can now scroll, however, the drop down closes immediately when I lift the finger after scrolling. In this way, it is not possible to scroll and select an entry. Instead the entry is been selected which has been "touched" upon starting to scroll.

[Douglas Hays]

Dijit doesn't have as much mobile support as dojox/mobile in the 1.x streams. Lifting your finger while over an item is firing an onClick event. If you lift your finger outside the list of choices, then you can continue to scroll.

[Alexander Kläser]

Thanks for your answer. Albeit lifting the finger outside the scroll area would work, I am not convinced that many people would find out by themselves about this possibility. I agree that dijit does not have as much mobile support as dojox/mobile and it should not. Up to which degree is dijit suppose to support mobile browsers? As a developer, I would be very happy to know that I can use dijits in my website/RIA and they we will work for mobile devices, as well - not in an optimized fashion, but in a way such that they are usable (please let me know if this point of view does not correlated with dojo's goal!). Without scrolling/selecting this does not seem to be the case to me.

[bill]

I'll take a look to see if I can fix that problem; I agree it's pretty bad.

[bill]

One solution seems to be to just monitor mouse events, see ​https://github.com/wkeese/dijit/tree/bug17388.

Probably the click listener should listen to touch.click rather than click, to avoid the 300ms delay.

[Bill Keese <[email protected]…>]

In f58eaae18cbeff7bb27cc58bec215fdd3fb20488/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Bill Keese <[email protected]…>]

In 26c53a080a63b5190d23457ba98b15430998e61b/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Alexander Kläser]

Dear Bill, thank you very much for your answer and the fix! I checked it this morning on both pads, it works just fine, great :) !

I just noted a minor flaw in the focus behaviour. On the form test page for mobile devices, I can scroll in the drop down. If I now select the entry in the drop down which is positioned above, e.g., the NumberSpinner? element, the entry gets correctly selected, yet the focus is immediately moved onto the NumberSpinner? element. Not sure whether it is intended in this way.

[bill]

I don't understand why you are talking about dijit/form/NumberSpinner. That doesn't even have a drop down.

It's expected behavior though that if you click something in the drop down, the drop down closes and focus is moved to the main widget.

[Alexander Kläser]

Sketch of the focus behaviour on a mobile device.

[Alexander Kläser]

It is a bit difficult to describe, I added a screenshot along with a sketch to describe the behaviour visually, I hope this makes it clearer. As said, it is just a minor flaw. Yes the focus should move to the main widget. I observed that the focus would go to the widget below the drop down menu item I selected via touch.

[bill]

Ah right I've seen that problem before. It would be worse if there happened to be a submit button underneath the drop down (or something like that). It's clearly a webkit bug but unfortunately I don't know how to work around it.

[Alexander Kläser]

OK.

[Bill Keese <[email protected]…>]

In 51e13fb77f4a2bf713e50ee412c488d357f6562d/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Bill Keese <[email protected]…>]

In d33125dd4fc2629e9feb265cc26f6d82dda0bc1a/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled?