Is there a way to keep the popup open?

Question

Hi,I'm using the autocomplete, and if I type some characters (ex. "abc") into the autocomplete, the popup displays with my filtered results; that's the expected behavior.Now, if I choose an item, the popup closes.Now, if I want to choose another item based on my first filter, I have to type in "abc" again to trigger the popup to be shown so I can select another single item.So if I wanted to select 4 items based on filter "abc", I have to type in "abc" 4 separate times and select a single item each time....Is there a way to keep the popup open, select multiple items, and then close the popup maybe when clicking the arrow or onblur of control?Thanks!

Buvana Sathasivam · Answer

Hi Sam,

Thanks for using Syncfusion Products.

By default behavior of autocomplete is, after selecting single item, suggestion popup box is automatically closed. If you search any item, suggestion popup box is opened automatically. If you wish to show suggestion box open state after selecting single item, you can follow the below sample solution. We have disabled showSuggestionBox using close event. This is used to prevent suggestion popup box closed when selecting an item. And the suggestion popup box will be hidden by focusing out of auto complete. Please find the below code.

AutocompleteFeatures.cshtml

@Html.EJ().Autocomplete("delimit").ClientSideEvents(e => e.Close("close").FocusOut("focusOut")) // Close and focus out event

function close(args) { // triggered when suggestion popup closed

this.showSuggestionBox = false; // Set showSuggestionBox as false

}

function focusOut(args) { // Triggered when focus out the autocomplete

this.showSuggestionBox = true; // Set showSuggestionBox as true

$("#delimit").ejAutocomplete("hide"); // Hide the suggestion popup box

}

</script>

API links: https://help.syncfusion.com/api/js/ejautocomplete#methods:hide

https://help.syncfusion.com/api/js/ejautocomplete#events:close