web-dev-qa-db-fra.com

Masquer/Afficher la sélection2

Je souhaite masquer ou afficher mon select2, mais je ne trouve pas de méthode dans l'API. J'utilise une solution de contournement, en cachant le parent, comme ceci:

$(document).on('change', '.country', function () {
    if ($(this).val() == $(this).data('current-countryCode')) {
        $('#states').parent().show();
    }
    else {
        $('#states').parent().hide();
    }
});

Mais j'aimerais savoir si quelqu'un pourrait aider ou s'il existe même une telle méthode dans l'API.

11
Marquinho Peli

Je fais la même chose, mais je cache le conteneur select2, qui est toujours le prochain nœud à partir du point de départ, de sorte 

$(document).on('change', '.country', function () {
    if ($(this).val() == $(this).data('current-countryCode')) {
        $('#states').next(".select2-container").show();
    }
    else {
        $('#states').next(".select2-container").hide();
    }
});

J'ai donc adopté la même approche que vous

22
Bindrid

Le problème est que vous devez masquer tous les éléments associés au menu déroulant select2 (tout ce que le plugin génère pour faire la magie).

J'ai résolu en utilisant un div qui contient la liste déroulante select2 et affiche/masque cette div.

1
Pila 77

Une autre solution de contournement: vous pouvez ajouter une classe à l'objet select2 à la création.

$("#user-box").select2({
    containerCssClass : "show-hide"
});

... et ensuite le cacher quand vous voulez avec

$(".show-hide").parent().parent().hide();
1
dMedia

Cela a fonctionné pour moi ..

jQuery("#my-select2").select2().next().hide();
0
Zein

J'utilise 4.0.6

https://select2.org/programmatic-control/methods

fermer

$('#YourId').select2('close');

ouvrir

$('#YourId').select2('open');
0
Mo D Genesis