Petite astuce souvent méconnue, un attribut très pratique a été introduit dans la plupart des navigateurs modernes : la possibilité de rajouter autocomplete="off" à un élément input. Quel intérêt ? Eviter que le navigateur ne propose automatiquement des valeurs pour cet élément.
Exemple : formulaire d’identification et création d’utilisateur (code volontairement simplifié)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | Page : index.html ------------------------------------------------ [...] <form> <input name="identifiant" /> <input name="motpasse" type="password" /> <input type="submit" /> </form> [...] Page : new_user.html ------------------------------------------------- [...] <form action="create_user.html"> Nom de l'utilisateur : <input name="identifiant" /> Mot de passe : <input name="motpasse" /> </form> [...] |
Que se passera-t-il dans cet exemple si l’administrateur a choisi d’enregistrer ses informations d’identification ? Elles seront automatiquement reprises dans le formulaire de création d’un nouvel utilisateur. Une solution simple serait de nommer différemment les champs sur la seconde page mais il est tout aussi simple de spécifier au navigateur que l’on ne souhaite pas reprendre les informations en rajoutant autocomplete="off" en attribut dans les champs input :
1 2 3 4 5 6 7 8 9 | [...] <form action="create_user.html"> Nom de l'utilisateur : <input name="identifiant" /> Mot de passe : <input name="motpasse" /> </form> [...] |
C’est par exemple très pratique pour éviter de devoir retravailler des données avec cakephp et garder les fonctionnalités « automagic ».
Prenons un autre exemple : vous souhaitez utiliser Ajax pour proposer des réponses en fonction de la saisie dans un champ input. Une autre fonctionnalité des navigateurs modernes est de proposer automatiquement des suggestions en fonction d’anciennes saisies dans une liste déroulante. Problème avec votre fonctionnalité Ajax qui peut alors entrer en conflit. Là encore, la propriété autocomplete vous permet un meilleur contrôle de l’interface utilisateur.
Le validateur W3C signale une anomalie !
Dans la version 4.01 d’HTML et 1.0 d’XHTML, la propriété autocomplete n’est pas dans les spécifications du W3C. En revanche, le W3C le prévoit dans XHTML 2 et HTML 5 (du moins la question est posée). Dans l’intervalle, les navigateurs modernes ont déjà pris le train en marche car cet attribut est notamment utilisé par des sites demandant des numéros de carte de crédit.
La fondation Mozilla a alerté à de nombreuses reprises sur les risques de sécurité à utiliser un tel attribut par rapport à l’implémentation qui en avait été faite dans les navigateurs à l’époque mais la polémique s’est quasiment éteinte depuis la sortie des versions postérieures à 2008.
Toutefois, le validateur du W3C continue de signaler une erreur car autocomplete reste un attribut non standard. Pour passer outre malgré tout, il suffit d’attribuer la propriété par javascript après le chargement de la page ou d’émuler complètement la fonctionnalité. Ce n’est pas élégant mais c’est le seul moyen à l’heure actuelle d’avoir l’imprimatur du W3C.
Tags : autocomplete, formulaire, html, navigateur, W3C, xhtml
