Développer le contenu d'un élément select pour augmenter le nombre d'éléments d'option

Question

J'ai un élément select avec un grand nombre d'éléments d'option et je cherche un moyen de basculer entre avoir toutes les options disponibles et avoir un sous-ensemble des options disponibles pour la sélection (le sous-ensemble étant les options les plus populaires). Les options sont classées par ordre alphabétique et sont regroupées selon la lettre initiale de leur valeur. Si l'utilisateur ne voit pas l'option qu'il souhaite lors de la navigation dans l'élément de sélection présentant un sous-ensemble d'options, il serait bon de pouvoir sélectionner une option nommée quelque chose comme "afficher plus de Bs" et, sans réduire le sélectionnez élément, l'ensemble complet des options apparaissent comme par magie. En s'effondrant, je parle du comportement normal d'un élément select lorsque l'une de ses options est sélectionnée. Il serait évidemment facile de sélectionner une option et de déclencher la re-population de l'élément select, mais du point de vue des utilisateurs, il n'est pas vraiment intuitif si l'élément select doit s'effondrer pour se repeupler - mon sentiment est que le L'utilisateur peut s'imaginer qu'il a besoin de cliquer sur le bouton de recherche pour voir plus de Bs alors qu'en réalité il aurait besoin de rouvrir le select.

Donc, ma question alors: est-il possible de repeupler ou ajouter des options à un élément de sélection sans l'écraser? J'ai, bien sûr, parcouru le web à la recherche d'une solution et je n'ai rien trouvé de valeur - cela pourrait bien sûr être dû à ma recherche (éventuellement en manque) de search-fu. Je me sens comme il devrait y avoir une solution javascript (pas mon fort) et idéalement un jquery, alors mieux vaut demander à certains experts. Naturellement, je suis ouvert à d'autres solutions élégantes et intuitives pour atteindre le même résultat, si ma question renvoyait un "Non!".

Merci d'avoir lu.

Answer 1

Dit simplement: non. Au moment où l'élément sélectionné perd le focus, la boîte de sélection s'effondre. Si vous vouliez créer un outil de sélection dynamique sans avoir un effondrement non intuitif, je suggérerais de sortir des sentiers battus.

Prenez une journée et pensez à toutes les façons possibles de créer une interface utilisateur pour atteindre cet objectif d'affichage des données. Peut-être abstraction des options "Sélectionner plus ..." en dehors de la boîte de sélection. Peut-être ne pas utiliser une boîte de sélection et d'utiliser un widget de style accordéon.

Modifier: Maintenant que j'y pense, c'est possible avec du JavaScript-fu. Au lieu d'utiliser une liste de sélection, vous pouvez créer une fenêtre de style pop-up. Un exemple typique de ceci est la liste déroulante StackExchange dans le coin supérieur gauche de votre écran.