Je cours une requête de base de données pour charger une liste déroulante en utilisant jquery. Est-il possible d'afficher les mots "Chargement ..." dans la liste déroulante lorsque la requête est en cours d'exécution?Afficher "Chargement en cours ..." dans la zone de liste déroulante
Merci.
Vous pouvez ajouter l'article temporaire à votre liste déroulante tandis que le paiement ajax est en cours d'exécution:
$('#myDropDown').prepend($('<option></option>').html('Loading...'));
Pourquoi appeler la méthode HTML quand vous pouvez simplement faire $ ('# myDropDown'). Prepend (''); semble plus facile à lire à mon humble avis. – SolutionYogi
Je suis nouveau en programmation, pouvez-vous me dire, comment puis-je faire avec mon code? (https://stackoverflow.com/questions/42593871/ajax-combo-box-with-please-wait-label-for-loding-data) –
Appelons votre menu déroulant « userChoice », vous pouvez écrire du code comme
$(document).ready(
function()
{
//Before calling your ajax method, clear the select drop down.
//and add a loading option.
$('#userChoice')
.children()
.remove()
.end()
.append('<option value="">Loading...</option>');
$.ajax(
//Load the userChoice as usual in success handler of your ajax call.
success : function() { //Load #userChoice }
);
}
);
S'il n'y a rien là pour commencer, faites juste que votre HTML par défaut et vous avez éliminé la moitié de votre jQuery.
<select>
<option>Loading...</option>
</select>
Et lorsque votre requête est terminée, il suffit de remplacer le option seul avec vos résultats.
c'est l'option la plus saine (sans jeu de mots) à mon avis :) + 1 –
Si vous exécutez la requête par le biais d'un appel AJAX, vous pouvez utiliser quelque chose comme ce qui suit pour effacer tout d'abord la liste déroulante et insérez le message de chargement (en Javascript côté client):
var lb = document.getElementById ("myDropdownList");
lb.options.length = 0;
var newOpt = new Option("Loading...", "");
lb.options[0] = newOpt;
// Your jquery call here
...
ajouter cette avant ajax après
$('#myDropDown').empty();
$('#myDropDown').append($('<option></option>').html('Loading...'));
puis à nouveau le succès dynamique menu déroulant append
$('#myDropDown').empty();
$('#myDropDown').append($('<option></option>').val("").html("Select"));
for (var i = 0; i < array.length; i++) {
$('#myDropDown').append($('<option></option>').val(array[i].selectedvalue).html(array[i].selectedtext));
}
Pour votre information Lorsque vous ajoutez des éléments à la liste déroulante après l'avoir récupérée, évitez d'ajouter manuellement chaque option à la liste si le nombre d'options est supérieur à un montant insignifiant. Vous voudrez faire un insert de batch similaire à: var options = []; var index = -1; pour (var article dans articles) { options [++ index] = ''; } options [++ index] = ''; $ (ListBox) .after (options.join ('')); Le code d'avertissement n'a pas été testé et ne fonctionnera probablement pas tel quel. –
Ugh, le formatage ne prend pas ici, pas vraiment sûr de savoir comment le faire correctement. Voir http://stackoverflow.com/questions/815103/jquery-best-practice-to-populate-drop-down en tant que point de lancement pour les performances avec un grand nombre d'options. Fondamentalement, vous voulez limiter la quantité de manipulation DOM que vous faites. Il est plus rapide de faire un grand insert dans le DOM que de le mettre à jour une grande quantité de fois. –