Multi Select Object to have horizontal scroll bar



Danny Cheah

Hi David,

Is there a way to have a horizontal scroll bar for the MultiSelect object? My array item is quite long and it got truncated during runtime.


Thank you.
Best regards,
Danny Cheah

David Esperalta

Hello Danny,

If I am not wrong the Select control never show a horizontal scroll, and, we can't force it using any CSS style. A possible workaround can be to place the Select inside a Container, made the Select as width as the larger item, and, set the Container's width to what we wanted, and then use the "overflow-x: auto" of the Container. You can see this approach in the below app sample:

Another possible approach is to use a Menu control instead of a Select one, and use the "overflow-x" of the Menu:

Another approach (probably the best to me) can be to use a HTML control, and, use our own HTML markup to show a list of "large items" in a way that don't get out of the screen, so we no need the horozintal scroll at all:

P.S. In this last app sample, you must look at the view Show event, as well the HTML markup placed in the used HTML control.



Danny Cheah

Hi David, thank you for taking the time to help me. Unfortunately I need to have multi select. The last sample does not allow me to do multi select. Anyway, I'm currently looking at the checkbox object sample to see if I can use this instead.

Thanks


Thank you.
Best regards,
Danny Cheah

David Esperalta

Hello Danny,

You are right: I forget that we are talking about a multiselect list... but it's ok, with a bit more work we can get something like that working:

I add a bit more of Javascript and a new "item-selected" CSS class in the app "Inline CSS" option.



Danny Cheah

Hi David

I managed to get it done. Thank you very much.


Thank you.
Best regards,
Danny Cheah

David Esperalta

You're welcome, Danny!



Everybody can read the DecSoft support forum for learning purposes, however only DecSoft customers can post new threads. Purchase one or more licenses of some DecSoft products in order to give this and other benefits.