web-dev-qa-db-fra.com

la largeur automatique du menu déroulant select2 ne fonctionne pas correctement

J'utilise select2 pour définir la variable dropdownautowidth sur true sur ma page de recherche SharePoint. Elle fonctionne parfaitement au chargement de la page pour la première fois. Après avoir recherché un mot-clé, la page se charge avec les résultats de la recherche, puis dropdownautowidth n'est pas défini sur true. J'utilise l'instruction $('#ddlCategory').select2({dropdownAutoWidth : true}); sur ma fonction document.ready.

Toute aide est appréciée.

jquery-select2
11
Surendra Chatakondu

Cela a fonctionné pour moi:

$('select').select2({
    dropdownAutoWidth : true,
    width: 'auto'
})
26
Mawi

vous devez le citer, comme:

$('#ddlCategory').select2({dropdownAutoWidth: 'true'});

cela fonctionne pour moi.

12
7heaven

Dans select2 4.0.0, cela ne fonctionnera pas pour moi non plus. J'utilise cette solution de contournement:

$('select').select2();

Le css:

select + .select2-container {
  width: 100% !important;
}
5
Frank

Je viens de mettre le paramètre width: 'auto' sur l'appel de fonction et puis cela fonctionne très bien.

$('#months').select2({
    width: 'auto',
    allowClear: false,
    height: '100%',
});
1
LeoSarli

Ces ajoutant ces lignes:

.select2-icon-result {
    display: flex;
    flex-flow: row nowrap;
}

à mon fichier css principal résolu le problème de "comment appliquer des espaces blancs: nowrap in autocomplete.ModelSelect2" :

0
Michel MARTIN

J'ai essayé chaque solution ici, mais ce qui a fonctionné a été:

width: '100%'

ou

width: 'style'

et ajouter un attribut de style à l'élément select, contenant au moinswidth:100%.

0
Andreas Bergström

Ajuster le CSS pour la classe .select2-container de display: inline-block; à display: block; a fonctionné pour moi.

0
JoeTidee