web-dev-qa-db-fra.com

fermer la liste déroulante select2 via javascript / jquery

Bonjour, comment puis-je fermer correctement une liste déroulante select2 via jquery ou javascript ??

pour l'instant, j'utilise select2-dropdown.toggle() pour le fermer,

mais j'ai remarqué qu'il masquera simplement la liste et que la case select2 est toujours en surbrillance enter image description here

Je veux perdre le focus ou quelque chose comme ça juste pour le fermer correctement et pouvoir arriver à un résultat comme celui-ci enter image description here.

par la façon dont les captures d'écran sont sombres parce que ces cases select2 sont sous un modal bootstrap qui apparaissait chaque fois que j'appuyais sur Entrée.

Tout conseil serait vraiment apprécié! Merci d'avance

javascriptjqueryhtmltwitter-bootstrapjquery-select2
16
melvnberd

celui-ci fonctionne pour moi $("#select2-drop-mask").click();

8
melvnberd

Je sais que c'est une vieille question, mais pour ce faire en utilisant l'API, vous devez simplement faire ce qui suit:

API Select2

 $("#select2-drop-mask").select2("close");

La question mentionne également la boîte de dialogue modale bootstraps qui tend à être une raison pour laquelle les gens veulent la fermer par programme.

Pour les informations de n'importe qui, voici comment procéder:

Bootstrap

$('#myModal').on('hidden.bs.modal', function () {
  $('#select2-drop-mask').select2("close");
})

Bootstrap 2

$('#myModal').on('hidden', function () {
   $('#select2-drop-mask').select2("close");
})
30
hutchonoid

Dans la v4.0, aucune des autres réponses ne fonctionnait pour moi. L'utilisation de jQuery pour sélectionner uniquement le masque n'a eu aucun effet. J'ai dû utiliser l'identifiant de la boîte de sélection elle-même:

$("#mySelectElement").select2("close")

Cela a également fonctionné, mais peut ne pas être préféré:

$("#mySelectElement").select2().trigger("select2:close");

Documentation

De plus, pour Bootstrap 3 , le hidden.bs.modal était trop tard et le masque select2 persistait pendant une seconde pendant l'animation. Le hide.bs.modal a fonctionné un peu plus pour nous:

$('#modalYourModal').on('hide.bs.modal', function () {
    //close select2 in case its open
    $("#mySelectElement").select2("close");
});
10
shanabus

Le select2-dropdown-*mask* n'a pas fonctionné pour moi, mais ce qui suit a fonctionné.

$('#select2-drop').select2('close');
6
LimaNightHawk
select2-dropdown.blur();

Je pense que c'est ce que vous recherchez. Ici vous avez un exemple dans JSFiddle créé par moi tout à l'heure.

1
mbecares