Par exemple, avec jQuery, le code suivant ne fonctionne pas sur Internet Explorer (toutes les versions) :
$(document).ready(function() {
$('option').not('option.presente').hide();
});
Pas très pratique lorsqu’on doit filtrer le contenu d’une liste de sélection en se basant sur le contenu d’un champ variable (exemple, une liste de pays) … Le seul moyen que j’ai trouvé était de créer plusieurs éléments SELECT puis d’en afficher un et de cacher les autres lorsque le contenu de notre champ variable change.
Une autre solution serait de stocker le contenu des listes de sélection via un objet Javascript (reçu en JSON) et de remplir une seule et même liste avec ce contenu lorsque le champ variable est changé.
Autres idées?
Supprimer directement le nœud dans le DOM via JavaScript ?
20cent (8 janvier 2008 à 11:40 EST)
Oui, mais après si on veut ré-afficher le noeud, il faut le re-créer!
Rémi Prévost (8 janvier 2008 à 13:54 EST)
Sacré IE
De toute façon, en faisant des tests j’ai remarqué un petit bug même dans le cas où cette astuce fonctionne : si on met le focus sur le select et que l’on change l’option avec les flèches haut/bas, les options cachées apparaissent quand même.
Donc à mon avis stocker les données dans un objet JS c’est encore la meilleur solution.
Yannick Croissant (8 janvier 2008 à 20:29 EST)
Dans tous les navigateurs?
Rémi Prévost (9 janvier 2008 à 7:57 EST)
Au moins dans Firefox, je n’ai pas testé dans d’autres navigateurs.
Yannick Croissant (9 janvier 2008 à 10:33 EST)
Plus j’y pense, plus c’est un comportement logique — même si l’
OPTIONest cachée, elle fait encore partie de la liste de sélection.Rémi Prévost (9 janvier 2008 à 11:40 EST)
Oui, et après test j’ai encore des comportements différents dans Safari (option toujours visible) et Opera (espace vide laissé dans la liste à la place de l’option).
Je pense que l’on peut en conclure que ce n’est pas une bonne idée ;)
Yannick Croissant (9 janvier 2008 à 13:52 EST)
Bref, don’t mess with
OPTION’s!Rémi Prévost (9 janvier 2008 à 14:01 EST)