Input group in the sidenav

Questions
1

Hi all,

I was wondering whether it’s possible to create a menu/submenu item in a sidenav element that is able to be used as an input group. At the moment all of my sidenav menu items look like this:

	// CONTACTS
	menuItem = new Object();
	menuItem.id = "contactsListView";
	menuItem.text = "All Contacts";
	menuItem.iconStyleClass = "fas fa-address-book";
	menuItem.styleClass = "menu-item";

but I’d like to have one of the submenu items as an input group to search through types of contacts. I have tried to create one using a similar method to the cloud sample solution search:

// SEARCH
	menuItem = elements.navbar.createMenuItem('Search..', DEFAULT_NAVBAR_ACTIONS.SEARCH, 'RIGHT')
	menuItem.displayType = 'INPUT_GROUP';
	menuItem.styleClass = 'closed searchbar';
	menuItem.inputButtonStyleClass = "btn-default";
	menuItem.iconName = "fa fa-search search-btn";
	menuItems.push(menuItem)

but haven’t had any luck yet. Is this possible with the sidenav element?

Thanks,
Alasdair

2

I don’t think this is possible with the Servoy sidenav component, it only supports (nested) menuitems.

What you could do is create a small form with your search element and add this form as headerForm/footerForm to the sidenav.

This should allow more flexiblity with the code, with the downside of having only 2 possible placements.

3

Ah I see. Might just leave it for the time being and have a selection on the main contact table form instead then.

Was debating for a while whether I should use a menu item that triggers an input dialogue popup but it feels a little clunky.