search formcontrol with button dropdown and text input box

Webix JS
1

Any tips how to create control that looks like this screenshot and behaves like it.

https://imgur.com/Lf9PKe5

(Outlook Search bar, a combination of a menu item where the selected menu item text is shown combined with a search textbox and optionally the tiny dropdown icon to support a custom dropdown form with more search fields.

2

Hello @mdissel ,
As a solution, you can use ui.menu and custom ui.search.
Here is an example of how it might look:
https://snippet.webix.com/o2mjynwr

3

Thanks! A good start!

  • the first menu item should be caption of the button
  • when a menu item is selected the caption of the button should be set to the selected item
  • the input caret is on top of the search icon in the textbox.

Ideally this should be embedded in once control and the set/get value should return an object with the input text and selected button and/or the the values from the dropdown form.