Comment vérifier qu'une option est sélectionnée dans un menu avec JQuery, et si ce n'est pas le cas lui attribuer une option par défaut ?
Le langage JavaScript et la bibliothèque jQuery permettent de détecter si aucune option n'a été choisie par l'utilisateur et, par exemple, d'en choisir une par défaut.
Il est possible, dans un formulaire HTML, de ne sélectionner aucune option dans une liste déroulante et de valider le formulaire. Heureusement, le langage JavaScript et la bibliothèque jQuery permettent de détecter si aucune option n'a été choisie par l'utilisateur et, par exemple, d'en choisir une par défaut. Une option sélectionnée possède l'attribut selected dont la valeur est égale à selected (autre astuce connexe: Comment changer la valeur d'une liste défilante en jQuery ?).
Exemple de liste sans option sélectionnée :
<select id=maListe> <option value=1>Option A</option> <option value=2>Option B</option> <option value=3>Option C</option> </select>
Le sélecteur option:selected permet de récupérer dans une liste les options sélectionnées. En testant le nombre d'options sélectionnées avec l'attribut length, on détecte si l'internaute n'a pas choisi d'option. Afin de raccourcir le code, au lieu de tester le nombre d'options par rapport à 0, on peut vérifier si la valeur correspond à false (qui est égal à 0) avec l'opérateur de test !. Pour ensuite choisir une option par défaut, il suffit de sélectionner l'option en la recherchant par exemple sur sa valeur avec le sélecteur [value=], puis de lui ajouter l'attribut selected avec la méthode attr().
if (!$(#maListe option:selected).length)
$(#maListe option[value='3']).attr('selected', 'selected');