Peupler des champs déroulants
Bonjour,
Je cherche à peupler des champs déroulants d'un formulaire avec des données provenant d'une requête AJAX.
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20
| function SelectCollection(){;
$.ajax({
url: monurl,
type: 'GET',
datatype: 'json',
complete: function(res) {
var record = res.responseJSON.records;
for (const val of record) {
$('.collection_selection').append($(document.createElement('option')).prop({
value: val.id,
text: val.nom
}));
}
}
})
} |
Le problème est que j'appelle cette fonction plusieurs fois dans mon code et je me retrouve systématiquement avec une liste déroulante avec des valeurs dupliquées.
Je me retrouve avec une liste déroulante peuplée :
option1
option2
option3
option1
option2
option3
...
et autant de fois que la fonction est appelée.
Comment faire pour peupler une liste déroulante (<select>) et éviter le comportement décrit plus haut ?
Merci pour vos retours,
Sylvain