Unable to see Multiselect and Autocomplete dropdown in Modal

[Cyril Ovely]

Hi Team,

I am working on a Syncfusion multiselect dropdown with checkboxes inside the bootstrap modal.

Here I am facing an issue with the ejs-multiselect dropdown and ejs-autocomplete components not working inside the bootstrap modal; the dropdown is opening and closing immediately.

Please provide me the solution for this as a priority.

https://codesandbox.io/s/syncufsion-v18-multi-select-forked-8xwnys

I attached the working code sandbox example.

Thanks & Regards,

Cyril Ovely

[Sureshkumar P]

Hi Cyril,

This is not an issue from our component. When opening the model dialog the component gets focused this is the issue from the bootstrap model dialog. We suggest you refer to the below online blocks to resolve the issue from your application

Documentation links:

1. https://stackoverflow.com/questions/14795035/twitter-bootstrap-modal-blocks-text-input-field

2. https://github.com/sweetalert2/sweetalert2/issues/374#issuecomment-268802123

3. https://stackoverflow.com/questions/38568621/cannot-type-or-even-focus-in-input-type-text-while-bootstrap-modal-is-open

4. Also, we suggest you data-bs-focus="false" as a parameter to resolve the issue.

Regards,

Sureshkumar P

[Cyril Ovely]

Hi Team,

Thanks for the suggestions. I have added "no-enforce-focus" to resolve this focus issue.



Hope it will be help to someone.

Regards,
Cyril Ovely

[Shereen Shajahan]

Glad that your issue has been resolved. We are marking this as solved.