Liste déroulante Dans un formulaire, la liste déroulante est utilisée lorsque l’utilisateur doit faire un seul choix parmi une liste d’options. Elle est une alternative aux cases à cocher lorsqu’une liste d’options est très longue. Exemples Les exemples ci-dessous reproduisent les variantes des listes déroulantes, en incluant celle avec une aide à la saisie et celle avec une consigne. Les champs en erreur peuvent être vus en laissant vides les boutons et en cliquant sur Suivant. Liste déroulante Texte pour consigne - Sélectionner -Choix AChoix BChoix C Liste déroulante avec étiquette personnalisée Étiquette personnaliséeChoix AChoix BChoix C Liste déroulante avec valeur par défaut - Sélectionner -Choix AChoix BChoix C Liste déroulante (facultatif) Texte d’aide à la saisie - Aucun(e) -Choix AChoix BChoix C Liste déroulante avec champ de recherche - Sélectionner -AED – Dirham des Émirats arabes unisAFN – AfghaniALL – LekAMD – Dram ArmenienANG – Florin des Antilles néerlandaisesAOA – KwanzaARS – Peso ArgentinAUD – Dollar australienAWG – Florin arubaisAZN – Manat azerbaïdjanaisBAM – Mark convertibleBBD – Dollar de la BarbadeBDT – TakaBGN – Lev bulgareBHD – Dinar de BahreïnBIF – Franc du BurundiBMD – Dollar des BermudesBND – Dollar de BrunéiBOB – BolivianoBRL – Réal brésilienBSD – Dollar des BahamasBTN – NgultrumBWP – PulaBYR – Rouble biélorusseBZD – Dollar de BelizeCAD – Dollar canadienCHF – Franc suisseCLP – Peso chilienCNY – Yuan ren-min-biCOP – Peso colombienCRC – Colon du Costa RicaCUC – Peso cubain convertibleCUP – Peso cubainCVE – Escudo du Cap-VertCZK – Couronne tchèqueDJF – Franc de DjiboutiDKK – Couronne danoise (krone)DOP – Peso dominicainDZD – Dinar algérienEGP – Livre égyptienneERN – NakfaETB – Birr éthiopienEUR – EuroFJD – Dollar fidjienFKP – Livre des Îles MalouinesGBP – Livre sterllingGEL – LariGGP – Livre de GuerneseyGHS – CediGIP – Livre de GibraltarGMD – DalasiGNF – Franc guinéenGTQ – QuetzalGYD – Dollar de GuyanaHKD – Dollar de Hong KongHNL – LempiraHRK – KunaHTG – GourdeHUF – ForintIDR – Roupie indonésienneILS – ShékelIMP – Livre mannoiseINR – Roupie indienneIQD – Dinar irakienIRR – Rial iranienISK – Couronne islandaise (krona)JEP – Livre de JerseyJMD – Dollar jamaïcainJOD – Dinar jordanienJPY – YenKES – Shilling du KenyaKGS – SomKHR – RielKMF – Franc des ComoresKPW – Won de la Corée du NordKRW – Won de la Corée du SudKWD – Dinar koweïtienKYD – Dollar des Îles CaïmanKZT – TengeLAK – KipLBP – Livre libanaiseLKR – Roupie du Sri LankaLRD – Dollar libérienLSL – Loti du LesothoLTL – Litas lituanienLVL – Lats lettonLYD – Dinar libyenMAD – Dirham marocainMDL – Leu moldaveMGA – Ariary malgacheMKD – DenarMMK – KyatMNT – TugrikMOP – PatacaMRO – OuguiyaMUR – Roupie de MauriceMVR – RufiyaaMWK – Kwacha malawienMXN – Peso MexicainMYR – Ringgit de la MalaisiMZN – MeticalNAD – Dollar namibienNGN – NairaNIO – Cordoba oroNOK – Couronne norvégienneNPR – Roupie du NépalNZD – Dollar néo-zélandaisOMR – Rial omanaisPAB – BalboaPEN – Nouveau solPGK – KinaPHP – Peso philippinPKR – Roupie du PakistanPLN – ZlotyPYG – GuaraniQAR – Riyal du QatarRON – Leu RoumainRSD – Dinar serbeRUB – Rouble russeRWF – Franc rwandaisSAR – Riyal saoudienSBD – Dollar des Îles SalomonSCR – Roupie des SeychellesSDG – Livre du SoudanSEK – Couronne suédoiseSGD – Dollar de SingapourSHP – Livre de Sainte-HélèneSLL – LeoneSOS – Shilling de SomalieSRD – Dollars du SurinameSTD – DobraSVC – Colon salvadorienSYP – Livre syrienneSZL – LilangeniTHB – BahtTJS – SomoniTMT – Manat turkmèneTND – Dinar tunisienTOP – Pa’angaTRY – Livre turqueTTD – Dollar de Trinité-et-TobagoTWD – Nouveau dollar taïwanaisTZS – Shilling tanzanienUAH – HrivnaUGX – Shilling ougandaisUSD – Dollar des États-UnisUYU – Peso uruguayenUZS – Soum d’OuzbékistanVEF – BolivarVND – DongVUV – VatuWST – TalaXAF – Franc CFA Laisser ce champ vide Accessibilité L’étiquette de la liste déroulante doit être à proximité de la liste déroulanteL’étiquette de la liste déroulante doit être codée dans une balise <label>La balise <label> doit être liée à la liste déroulanteLa sélection d’un élément de la liste ne doit jamais déclencher une action qui déplacerait le focus ou naviguerait vers une autre page Information complémentaire au champ Ne pas oublier que tout texte apportant de l’information complémentaire à la liste déroulante (un signe de $, une consigne, le message d’erreur) doit y être lié. Pour ce faire, il faut : Ajouter l’attribut aria-describedby sur la liste déroulanteAjouter l’attribut id sur la balise contenant le texte (<p>, <span>, <div>)Lier l’attribut aria-describedby à l’attribut id (aria-describedby="id du texte")