Input group in the sidenav

[alasdairs]

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:

Code: Select all

   // 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:

Code: Select all

// 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

[robert.edelmann]

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.

[alasdairs]

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.