How to open DropdownSearch widget using a button?
Question
Application Type
Reactive

I have a DropdownSearch widget from OutsystemsUI module and I want to open it (show the list) when clicking a button.

I tried calling this javascript code in the Button on click but it doesn't work.

Is it possible to achieve this?

mvp_badge
MVP
Solution

Hi Kenneth,

Yes, it's possible.

  • Add a custom style class (e.g., dropdowSearch--js) to the DropdownSearch widget as highlighted below.

  • On Button click, invoke the open method for the dropdownSearch element using JS as shown below. 

JS Snippet:

setTimeout(function() {
    document.getElementById($parameters.DropdownSearchId).querySelector('.dropdownSearch--js').open();    
});

Demo screen: DropdownSearchTask

Note: The DropdownSearch widget in the latest OutSystemsUI references Virtual Select JS library

For more info, refer to the official Virtual Select JS documentation: https://sa-si-dev.github.io/virtual-select/#/methods?id=open

Refer to the attached oml file.

I hope this helps you!


Kind regards,

Benjith Sam

RWALab_DropdownSearchTask.oml

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.