Select2 doesn't work in jquery.confirm Modal

31 Views Asked by At

I have the problem that select2 doesn't work in a jquery.confirm modal. It's not clickable and doesn't show any entries. It works fine outside the modal.

<script src="js/select2.full.min.js"></script>
<link rel="stylesheet" href="css/select2.min.css">

$.confirm({
    title: 'Modal',
    boxWidth: '500px',
    icon: 'fa-solid fa-wagon-covered',
    useBootstrap: false,
    theme: 'material',
    typeAnimated: true,
    type: 'green',
    content: "content"
});
1

There are 1 best solutions below

0
M1NT On

You have to add an extra line that defines the container of the modal content as parent after content is ready.

$.confirm({
    title: 'Modal',
    boxWidth: '500px',
    icon: 'fa-solid fa-wagon-covered',
    useBootstrap: false,
    theme: 'material',
    typeAnimated: true,
    type: 'green',
    content: "content",
    onContentReady: function() {

        //Add this line after content is ready
        $("#selUser").select2({
            dropdownParent: $(".jconfirm-content").parent()
        });
    }
});