We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

EjsMultiSelect doesn't work inside Bootstrap 4 Modal

I'm having issue using EjsMultiSelect (VisualMode.CheckBox) inside Bootstrap 4 modal. The dropdown menu shows for a sec and then disappears. I have tested the below code outside of modal and it works. Please note that it doesn't work only when Mode is set to "VisualMode.CheckBox".

Can we please have a solution?

Razor Component:

Bishan M.

3 Replies

SD Saranya Dhayalan Syncfusion Team December 12, 2019 07:28 AM UTC

Hi Bishan,

Thanks for contacting us. 
We have validated the reported issue in our end. It occurs due to the bootstrap modal enforcing the focus, when an element which is not a child of bootstrap modal gets focused. Kindly refer to the following online blogs for further reference.  
This issue can be resolved this issue by unbinding the focusin modal event in show modal event as per the suggestion given in the above blogs.  
<script type="text/javascript">  
    $(function () {  
        $('#modalMSDDL').on('shown.bs.modal'function () {  
Please find the modified sample in the following link  
Please let us know if you need any further assistance on this. 

Saranya D 

BM Bishan Moteria December 12, 2019 01:40 PM UTC

Hi Saranya,
Thank you for the solution and online blog reference links. The VisualMode.CheckBox mode now works inside the modal after unbinding the focusin modal event.

Bishan M.

SD Saranya Dhayalan Syncfusion Team December 13, 2019 04:10 AM UTC

Hi Bishan 
Most Welcome.  
Please let us know, if you need any further assistance on this.  
Saranya D 

Live Chat Icon For mobile
Up arrow icon