HTML5 et les formulaires #2
Date : jeudi 02 août 2012 @ 12:00:45 :: Sujet : Php, Mysql, ...
De nouveaux attributs concernant les formulaires et leurs éléments ont aussi été introduits par HTML5.
Autofocus : Donne le focus à l'élément au chargement de la page. Autofocus peut être appliqué aux balises input, select, textarea et button.
Placeholder : Donne une indication à l'utilisateur sur le type de donnée à entrer. La valeur de l'attribut placeholder est affichée jusqu'à ce que le champ prenne le focus, ainsi qu'à la perte du focus si le champ est vide. S'applique aux balises input et textarea.
Form :Précise à quel(s) formulaire(s) est (sont) attaché(s) le champ. En utilisant l'attribut form, le champ peut être placé n'importe où dans la page, même en dehors des balises
Required : Attribut booléen indiquant que le champ est obligatoire. Cet attribut sert essentiellement pour les vérifications côté navigateur sans utiliser !javascript!.
Autocomplete : Attribut booléen indiquant si les suggestions de précédentes saisies doivent être affichées. Le navigateur retient les saisies associées à un champ et les propose en suggestion lors de la saisie, cet attribut permet de désactiver cette fonctionnalité.
Pattern : Permet de préciser une expression régulière que doit satisfaire la saisie. Lorsque vous utilisez cet attribut, n'oubliez pas d'ajouter un attribut title pour indiquer à l'utilisateur le format attendu.
Dirname : La valeur de cet attribut permet d'envoyer à la soumission du formulaire un paramètre indiquant le sens d'écriture. Le sens d'écriture peut être "ltr" ou "rtl". Cette valeur est envoyée avec les autres champs du formulaire si l'attribut est précisé.
Novalidate : Désactive les vérifications du formulaire avant de l'envoyer.
Formaction : Permet de modifier l'attribut action du formulaire. Cet attribut est valable pour les éléments input (de type submit) et button.
Formenctype : Permet de modifier l'attribut enctype du formulaire. Cet attribut est valable pour les éléments input (de type submit) et button.
Formmethod : Permet de modifier l'attribut method du formulaire. Cet attribut est valable pour les éléments input (de type submit) et button.
Formnovalidate : Permet de modifier l'attribut novalidate du formulaire. Cet attribut est valable pour les éléments input (de type submit) et button.
Formtarget : Permet de modifier l'attribut target du formulaire. Cet attribut est valable pour les éléments input (de type submit) et button.
L'objet FormData
L'une des améliorations apportées à XMLHttpRequest est l'ajout de l'objet FormData. Avec cet objet, vous pouvez créer et envoyer des paires clé/valeur (optionnellement, des fichiers) avec XMLHttpRequest. Avec cette technique, vous pouvez envoyer des données au même format que si vous aviez validé un formulaire à l'aide de la méthode submit() de l'objet form avec l'encodage multipart/form-data.
L'objet FormData vous permet donc de créer des formulaires à la volée avec !javascript!, puis de les soumettre en utilisant XMLHttpRequest.send(). Voici un exemple d'utilisation :
var formData = new FormData();
formData.append("part_num", "123ABC");
formData.append("part_price", 7.95);
formData.append("part_image", un_fichier) var xhr = new XMLHttpRequest();
xhr.open("POST", "http://une_url/");
xhr.send(formData);
Vous pouvez aussi aussi utiliser FormData pour ajouter des données à un formulaire existant avant de le soumettre :
var formElement = document.getElementById("someFormElement");
var formData = new FormData(formElement);
formData.append("part_description", "The best part ever!");
var xhr = new XMLHttpRequest();
xhr.open("POST", "http://some.url/");
xhr.send(formData);
|