Dropdown items not displaying on tablet

Dropdown items not displaying on tablet

by Jaco-Louis Kruger -
Number of replies: 10

Good day everyone

This is my first post here.

I am currently working on a custom moodle mobile app. The app is working perfectly on a variety of devices, except for one of the two types of tablets that we provide our students with (which is rather unfortunate).

The tablet in question is the Lenovo TAB 2 A7-30HC. The tablet is unable to show items in a dropdown list, such as the different languages in the settings of the app. The app is however able to display these options in all of the other devices that I have tested the app with.

Whenever I tap on a dropdown list, a list opens with "entries" for all of the items in the list, but with no text displayed. I am able to select the items from the list, which then works as expected, except for the user not being able to read what they have selected from the dropdown list.

I have used the official moodle mobile app with the moodle demo site which gave me the same results. I have also tried using a variety of themes on the moodle site, which also gave the same results.

I would like to know if there is something that I am missing, or if it is a problem with the device that I am using.

Kind regards

Jaco-Louis

Average of ratings: -
In reply to Jaco-Louis Kruger

Re: Dropdown items not displaying on tablet

by Dani Palou -
Picture of Core developers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

Hello,

it seems to be a problem with that specific device. We use a simple HTML select (with Angular logic) to display those values, it's weird that the device is unable to render them.

Changing the theme in the site will do nothing since the app doesn't use those themes.

We don't have that device, so we aren't able to reproduce the issue. You could try to modify the settings template (www/core/components/settings/templates/general.html) and use a hardcoded select without angular logic to check if it works. Something like:

<select>

    <option label="عربي" value="ar">عربي</option>

    <option label="Български" value="bg">Български</option>

    <option label="English" value="en" selected="selected">English</option>

</select>

Kind regards,

Dani

In reply to Dani Palou

Re: Dropdown items not displaying on tablet

by Jaco-Louis Kruger -

Good day Dani

Thank you for the response.

I modified the settings template as you suggested, without any success.

Please find screenshots of the problem attached.

The screenshots show the "empty" language select, a gender select with no angular logic (also shows empty options), and an ionic-select for gender, which also did not work.

Do you perhaps have any other ideas that might work?

Kind regards

Jaco-Louis

Attachment Screenshot_2017-07-31-15-20-37.png
Attachment Screenshot_2017-07-31-15-20-45.png
In reply to Jaco-Louis Kruger

Re: Dropdown items not displaying on tablet

by Dani Palou -
Picture of Core developers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

Hi,

can you try to use a simple select in your device's browser to see if it works?

There is a working example in w3schools:

https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_select

Kind regards,

Dani

In reply to Dani Palou

Re: Dropdown items not displaying on tablet

by Jaco-Louis Kruger -

Good day Dani

I tried the w3schools example and the select works perfectly in the browser.

Do you have any further advice in this regard?

Kind regards

Jaco-Louis

In reply to Dani Palou

Re: Dropdown items not displaying on tablet

by Jaco-Louis Kruger -

Good day Dani

I tried the w3schools example and the select works perfectly in the browser.

Do you have any further advice in this regard?

Kind regards

Jaco-Louis

In reply to Jaco-Louis Kruger

Re: Dropdown items not displaying on tablet

by Dani Palou -
Picture of Core developers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

Hi again,

which Android version does the device have? It's weird that it works in browser but not in app :S

The only solution I can think of is to use Crosswalk. This will increase the size of your app a lot, but the app will have its own WebView instead of relying in the Android one, so the behaviour should be more consistent in all devices.

Kind regards,

Dani

In reply to Dani Palou

Re: Dropdown items not displaying on tablet

by Jaco-Louis Kruger -

Good day Dani

The device is currently on Android 5.0.1.

I'll have a look at Crosswalk and let you know how that works out.

Kind regards

Jaco-Louis

In reply to Jaco-Louis Kruger

Re: Dropdown items not displaying on tablet

by Pau Ferrer Ocaña -
Picture of Core developers Picture of Moodle HQ Picture of Peer reviewers Picture of Plugin developers

Hi Jaco-Louis!

I think this could be a problem with CSS processing on your device. To solve that we'd take a look to the browser's user agent is using your device to render the styles. Could you please send us this user agent?

From the app, go to the app settings on the side menu, and then select "About", scroll down a bit to find the  browser's user agent information. You can copy that of just send us an screenshot of the information provided.

Kind regards,

Pau

In reply to Pau Ferrer Ocaña

Re: Dropdown items not displaying on tablet

by Jaco-Louis Kruger -

Good day

The app is working fine now, which is strange. I have not changed anything significant. I then downloaded the official moodle app again, which did not work previously. I then tested the official app again, and it suddenly works.

I am guessing the devices received some updates that allows the app to work correctly now?

Kind regards

Jaco-Louis

In reply to Jaco-Louis Kruger

Re: Dropdown items not displaying on tablet

by Pau Ferrer Ocaña -
Picture of Core developers Picture of Moodle HQ Picture of Peer reviewers Picture of Plugin developers

Those are great news!!!

I also guess some updates on the devices do the work.

Enjoy the app!


Pau