Scrolling MDB Select Options on Mobile Devices

Topic: Scrolling MDB Select Options on Mobile Devices

Graham Meehan free asked 5 years ago

Expected behavior

An MDB Select which can scroll through its select-items in a manner normally expected on mobile devices. (Touch anywhere in a list and drag to begin scrolling)

Actual behavior

Touch-scrolling on mobile devices (or with mobile-mode active in Development Mode in Chrome) will either close the dropdown prematurely or unintentionally select a dropdown option if the user starts touch-scrolling directly on top of a dropdown option.

Successful scrolling can only be carried out if the user touches inside the unordered-list (ul) element but not inside of one of the contained list-item (li) elements, which is usually too small of a space to selectively touch on a mobile device.

Resources (screenshots, code snippets etc.) https://mdbootstrap.com/snippets/jquery/graham_meehan/1406048

Add comment

Graham Meehan free answered 5 years ago

1 0 Best answer

Issue resolved in Version 4.9.0.

Thanks!

Add comment

5rovaliev free answered 3 years ago

0 0 Best answer

I have a common issue with searchable select, when I try to scroll the searchable select the whole dropdown disappears. I have also a select without searchable input and it's working as respected. This issue appears only on Android devices with chrome browsers. Any suggestions?

Marcin Luczak staff commented 3 years ago

Hi,

Have you tried the workaround with commenting out the bindMobileDevicesMousedown() function in the source code of the select component? Could you also please create a snippet with your code? I was unfortunate to reproduce your problem on a mobile device with android and on a chrome browser, so maybe it is a case regarding your code.

Keep coding, Marcin

Add comment

gianlucagiacometti priority answered 5 years ago