DropDownList - Filtering

[ninopetrovic]

hello,

I have implemented a simple DropDownList on my website and tried to add filtering to it. I took the sample from your documentation which works fine on your page... but on mine i just cant get focus (cursor) in the input filed of the focus bar.

It is pretty much a fresh site and I tried multiple versions of dropDownList component.
BR. Nino

UPDATE: see comment bellow

[ninopetrovic]

Ok. I have managed to solve the problem on my site BUT this issue still has to be addressed by your team I think.
The problem was that i have dropDownList Component on bootstrap-s modal. And in their samples the tabindex tag is set to -1 which has an critical effect on input field for filtering dropDownList popup.

[PrinceOliver]

Hi @ninopetrovic,

Thank you for contacting us.

This issue occurs due to the bootstrap modal enforcing the focus on itself, when an element which is not a child element of bootstrap modal gets focused. The dropdown’s popup will be rendered in as child to body element out of the modal and hence when it is opened the input is focused out. Kindly refer to the following online blogs for further reference on this issue.

Link 1: sweetalert2/sweetalert2#374
Link 2: twbs/bootstrap#19971

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 () {   
        $('#exampleModal).on('shown.bs.modal', function () {   
            $(document).off('focusin.modal');   
        });   
    })   
</script>

Let us know if you need any further assistance on this.

Regards,
Prince

[bharathm03]

Closing the issue due to inactivity and solution is given.