Я использую приведенный ниже JS, чтобы указать параметры для моего выбора:
//**** Instance des Bootstrap-SelectPicker ****
$('.selectpicker').selectpicker({
style: 'btn-info',
size: 4,
showSubtext: true,
noneSelectedText: 'Pas de sélection',
showSubtext: true,
showTick: true,
});
var menus = [
{ controleur: "CatDdeurs", element: "Cat_Ddeur" },
{ controleur: "Communautes", element: "Communaute" },
{ controleur: "Occupations", element: "Occupation" },
{ controleur: "Provinces", element: "Province" },
{ controleur: "Scolarites", element: "Scolarite" },
{ controleur: "Sexes", element: "Sexe" },
{ controleur: "Situations_Matrimoniales", element: "SituationMatrimoniale" },
{ controleur: "Source_De_Revenus", element: "SrceRevenu" },
{ controleur: "Statuts_Legaux", element: "StatutLegal" },
{ controleur: "Tranche_Revenu", element: "TrancheRevenu" },
{ controleur: "Villes", element: "Ville" },
{ controleur: "Sources_Informations", element: "SceInfo" },
{ controleur: "Langues", element: "langMaternelle" },
{ controleur: "Langues", element: "LangAutre" },
{ controleur: "Conseillers", element: "Conseiller" },
];
menus.forEach(x => {
MenusDeroulants('GetListe' + x.controleur, $('#cbx_' + x.element));
});
//**** Permet de remplir la liste des menus déroulants ****
function MenusDeroulants(url, dropdown) {
$.getJSON(url, function (data) {
dropdown.empty();
for (var i = 0; i < data.length; i++) {
var obj = data[i];
for (var key in obj) {
var prenom;
var nom;
var ID;
//**** Traitement des demandeurs ou conseillers ****
if (url == "GetListeConseillers" || url == "GetListeDemandeurs") {
//**** Retrait du code ****
if (key == 'Code_Conseiller' || key == 'Code_Demandeur') {
ID = obj[key];
};
//**** Retrait du Nom ****
if (key == 'Nom_Conseiller' || key == 'Nom_Demandeur') {
//if (key.match(/Nom_C*/) || key.match(/Nom_D*/)) {
nom = obj[key];
};
//**** Retrait du Prénom ****
if (key == 'Prenoms_Conseiller' || key == 'Prenoms_Demandeur') {
prenom = obj[key];
};
} else { //**** Traitement des autres menus ****
//**** Retrait de l'ID ****
if (key.match(/ID_*/)) {//**** Traitement des demandeurs ou conseillers ****
ID = obj[key];
};
//**** Retrait du Nom ****
if (key.match(/Nom_*/)) {
nom = obj[key];
};
};
}
//**** On construit les options du menu déroulant ****
if (url == "GetListeConseillers" || url == "GetListeDemandeurs") {
dropdown.append($("<option></option>").attr("value", ID).text(nom).attr("data-subtext", prenom));
} else {
dropdown.append($("<option></option>").attr("value", ID).text(nom));
};
if ((nom.toUpperCase() == "CHICOUTIMI" && url == 'GetListeVilles')
|| (nom.toUpperCase() == "QUÉBEC" && url == 'GetListeProvinces')
|| (nom.toUpperCase() == "NON DISPONIBLE" && url != 'GetListeVilles' && url != 'GetListeProvinces')) {
dropdown.prop("selectedIndex", i);
};
}
dropdown.selectpicker('refresh');
});
}<link rel = "stylesheet" href = "https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity = "sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin = "anonymous">
<link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/css/bootstrap-select.min.css">
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity = "sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin = "anonymous"></script>
<script src = "https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity = "sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin = "anonymous"></script>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/js/bootstrap-select.min.js"></script>
<td style = "padding-left:10px">
<div class = "form-group">
<label for = "cbx_Sexe" class = "control-label">Sexe:</label>
<div>
<select class = "selectpicker" id = "cbx_Sexe"></select>
</div>
</div>
</td>Первые 12 элементов будут работать нормально, но как только я добавлю 3 последних, мои выборки начнут вести себя забавно: 3 последних иногда работают нормально, а иногда показывают пустое пространство в верхней части поля.
Иногда меню не закрывается, когда я открываю другие ... и так далее.
Я пробовал комбинировать 12 первых с каждой из 3 колодок, но всегда что-то будет.
Еще более странно то, что если я использую let say: "{controleur:" Sexes ", element:" Sexe "}, чтобы заполнить все 3, которые вызывают у меня проблемы, все работает отлично.
Это весь код был слишком длинным для вставки, поэтому я изолировал части, относящиеся к моему выбору Bootstrap. В основном у меня есть 15 выбранных элементов, питаемых от контроллера. Бесплатные карты плохо отображаются (см. Снимок экрана).



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Изменение раскрывающегося списка параметров моей функции (MenusDeroulants) на $ dropdown наконец решило проблему.
Ваш фрагмент кода работает неправильно, или я не могу понять вашу проблему. Исправьте код или объясните подробнее. "Как мне добавить элементы в список ???"