Keep dropdown open until clicked outside

In order to make the selection of multiple items more efficient for the user, I want the dropdown to stay open until the user clicks outside the element. I have tried to achieve this by subscribing to the onClose event and then simply cancel it (args.cancel = true;) and have a generic document on click function where I check if the click occurred outside the dropdown.

    $(document).on("click", function (event) {
        if (!$(event.target).closest(".e-dropdownbase").length) {
            //here I want to close the dropdown
        }
    });

Question: how can I close the dropdown programmatically? Or is there a better way to achieve this? FYI: the mode is set to "Box".

Thanks!


1 Reply

SP Sureshkumar P Syncfusion Team March 2, 2023 10:51 AM UTC

Hi Alexander,

We suggest you set the closePopupOnSelect property value as false to achieve your requirement.

Find the code example here:

<ejs-multiselect id="ddlClienteId" mode="Box" dataSource="@ViewBag.data" allowFiltering="true"

                 filterType="Contains" placeholder="Cliente" floatLabelType="Always"

                 popupHeight="220px" closePopupOnSelect="false">

 

    <e-multiselect-fields value="Value" text="Text"></e-multiselect-fields>

 

</ejs-multiselect>


Find the sample in the attachment:

Regards,

Sureshkumar P


Attachment: ASPCore_2117f83e.zip

Loader.
Up arrow icon