web-dev-qa-db-fra.com

Impossible de saisir le champ de recherche d'entrée de la liste déroulante Select2 (http://kevin-brown.com/select2/)

Impossible de saisir le champ de recherche de la liste déroulante Select2 ( http://kevin-brown.com/select2/ )

J'ai trouvé de nombreux problèmes répertoriés qui mentionnent le même problème, mais rien n'a fonctionné pour moi ( https://www.google.com/search?q=can%27t+type+in+select2&ie=utf-8&oe=utf -8 & client = firefox-b-ab ). Je ne peux pas saisir le champ de recherche d'entrée de la liste déroulante Select2 dans la boîte de dialogue du modèle à l'aide de jQuery. Au fait, je peux sélectionner la valeur fine dans le menu déroulant. Tentative d'insertion de tabindex: 0 mais pas de chance.

Code:

$.ajax({
    type: "POST",
    url: "<?php echo $myScripts; ?>",
    data: { id1: "get-release-dropdown-html", id100: "<?php echo $dbTable; ?>" },
    success:function(releaseDropdown){

        $('#progress').hide();

        $( "#modelDialog1" ).dialog({
            modal: true,
            width: '570',
            height: '600',
            resizable: true,
            position:
            {
                my: "center",
                at: "center",
                of: window,
             },
            title: "Trigger Build",
            open: function() {

                $(this).html("<br/>Please select job options.<br/><br/><br/><b>Release:</b>" + releaseDropdown + "<div style='margin-top:30px;'/><b>Build Release Candidate:</b><select id='sReleaseCandidate'><option value='ga' selected>GA</option><option value='beta1'>BETAX</option>'></br>");

                $("#sDescription").focus();

                $("#sRelease, #sReleaseCandidate").select2({
                    tags: true
                });
            },

            close: function() {
                $( this ).dialog( "close" );

            },

        });

    }

});
jqueryjquery-select2
11
Jitesh Sojitra

Comme indiqué dans https://github.com/select2/select2/issues/600#issuecomment-102857595

Vous devez spécifier l'élément de dialogue modal comme parent pour select2, ce qui garantira que le focus reste sur le modal même si vous avez cliqué sur l'élément select

$("#sRelease, #sReleaseCandidate").select2({
    tags: true,
    dropdownParent: $("#modelDialog1")
});
26
Saket Patel

Si vous utilisez Bootstrap Modal, supprimez simplement tabindex = "- 1" de l'attribut modal bootstrap. Dans mon cas cela a très bien fonctionné.

8
Dev Rathi