Hi,
I have a dropdown search that shows the items upwards - preventing me from searching or choosing the first items - instead of downwards (as it should be).
I have an action on selecting an item from the dropdown that will show some more info and all this info is in a container (cLists).
After the first time I choose the item, when choosing another one from the dropdown everything's normal.
Is there a way to make the dropdown show items downwards always or is there a solution for my problem?
TY!
Hi Carlos,
This is happening because may be you don't have space on your screen below the dropdown when you select first time. When you select first item, it shows the pannel below it with makes more space available below your dropdown and that is why in second time your dropdown opens downward.
This is default behaviour of HTML controls in any browser but one simple trick you can apply is instead of showing nothing before first selection you can show some kind of message panel which will add some space on screen and in turn it will allow dropdown to open downwards. For this you can use if widget in screen.
Anyway, you can handle this using CSS.
Thanks
JitendraYadav wrote:
Can this be handled using CSS? How?
Thanks and regards,
Nhorwin
It should be possible without CSS using the AdvancedFormat property to fix the dropdown downwards. There you can use all the detailed configuration from the underlying JavaScript library.
Try this in the AdvancedFormat property of the DropdownSearch widget:
"{""position"": ""bottom""}"
I added these two classes to override existing in OutSystemsUi, it worked for me. The first class is an old version of the dropdown and the second one is for a newer version. I found these classes using inspect in browser
.is-flipped .choices__list--dropdown{
bottom: auto !important;
}
.dropdown-expanded-up div.dropdown-list{