17 formes

17.1 Introduction à former

Formulaire HTML - cette section du document, qui contient les informations habituelles, la mise en page et des éléments spéciaux appelés éléments de contrôle (contrôle des boîtes, boutons radio, menus, etc.), ainsi que les étiquettes des contrôles. En règle générale, les utilisateurs "remplir" la forme par des contrôles de modification (la saisie de texte, la sélection des éléments de menu, etc.) avant de soumettre le formulaire pour le traitement agentts utilisateur (par exemple, sur le Web-servver, serveur de messagerie, etc.)

  <FORM action = "http://somesite.com/prog/adduser" method = "post">
  <P>
  <Label for = "prenom"> Nom: </ LABEL>
  <Input type = "text" id = "prenom"> <BR>
  <Label for = "nom"> Nom: </ LABEL>
  <Input type = "text" id = "nom"> <BR>
  <Label for = "email"> Email: </ LABEL>
  <Input type = "text" id = "email"> <BR>
  <Input type = "radio" nom = valeur "sexe" = "Homme"> Homme <BR>
  <Input type = "radio" nom = valeur "sexe" = "Femme"> Femme <BR>
  <Input type = "submit" value = "Envoyer"> <input type = "reset">
  </ P>
  </ FORM>

17.2 Contrôles

Les utilisateurs interagissent avec des formes en utilisant des contrôles nommés.

"Nom de l' élément" est spécifié par nom. La portée de l'attribut de nom pour un élément de commande dans le FORM est un élément FORM .

Chaque élément de commande comporte une première et une valeur de courant, qui sont tous deux des chaînes de caractères. Pour plus d'informations sur les valeurs initiales et les contraintes possibles sur les valeurs, voir. Dans la définition de la commande. En général, la "valeur initiale" de l'élément de commande peut être réglé en utilisant la valeur d'attribut. Cependant, la valeur d' origine de l'élément TEXTAREA donnée par son contenu, et l'élément de valeur originale OBJECT sous la forme déterminée par la mise en œuvre de l'objet ( par exemple se trouve en dehors du domaine de cette spécification).

"Valeur actuelle" élément de commande est d' abord fixé à une valeur initiale. Ensuite, la valeur de courant peut être modifiée par l'utilisateur ou un script.

La valeur initiale de la commande ne change pas. Ainsi, chaque moule lorsque la réinitialisation de la valeur en cours est réglé sur la valeur initiale. Si le contrôle est pas la valeur initiale, le résultat est des formes de secours imprévisibles.

Lorsque le formulaire est soumis pour le traitement, une forme est transmise paire d' éléments de contrôle de la valeur actuelle. paires nom / valeur mobilières sont appelés contrôles réussis .

17.2.1 types de contrôle

Le code HTML définit les types de contrôles suivants:

bouton

Les auteurs peuvent créer trois types de boutons:

• boutons d' envoi : Lorsqu'il est activé, ce bouton soumettre le formulaire. Le formulaire peut envoyer plusieurs boutons.
• boutons reset : Lorsqu'il est activé, ce bouton est pour toutes les commandes sont réglées à leurs valeurs par défaut.
• Les autres boutons : Pour tels l'action du bouton par défaut est non déterminé. Avec les attributs d'événements chacun de ces boutons peuvent être connectés scripts clients . Si l'événement de proiskhhodit (par exemple, le bouton presses polzovatell, libère, etc.) est inclus dans le script d'événement associé.

  Les auteurs devraient définir le langage de script pour les boutons de la déclaration du script par défaut (l'élément META ).

Les auteurs créent des boutons à l'aide d'un élément BUTTON ou INPUT . En savoir plus sur la façon dont différents types de boutons, voir. Dans la définition de ces éléments.

Remarque. Les auteurs sont priés de noter que l'élément BUTTON offre plus de possibilités que présentent les boutons de l'élément INPUT .

drapeaux

Checkboxes (et les boutons radio) - / désactiver les commutateurs qui peuvent être activés par l'utilisateur ... Le commutateur est "on", si l'attribut est défini sur un élément de commande sélectionné .

Lors de la soumission d' un formulaire avec succès seulement les commutateurs peuvent être inclus. Plusieurs cases à cocher dans un formulaire peuvent avoir le même nom de contrôle. Ainsi, par exemple, des cases à cocher permettent aux utilisateurs de choisir plusieurs valeurs des mêmes propriétés. Pour créer un élément de case à cocher est utilisé INPUT .

boutons radio

Les boutons radio sont comme des cases à cocher , sauf que lorsque plusieurs boutons sont utilisés le même nom de contrôle , elles sont mutuellement exclusives: si un bouton est activé, l'autre nécessairement éteint. Pour créer des boutons radio utilisés élément INPUT .

menu

Fournir aux utilisateurs des options à choisir. Menu créé par un élément SELECT , ainsi que des éléments OPTGROUP et l'OPTION .

la saisie de texte

Pour entrer un utilisateur texte écrivains peuvent créer deux types de contrôles. Element ENTREE crée un élément de commande pour le texte d'une seule ligne, et l'élément du TEXTAREA - saisie de texte sur plusieurs lignes. Dans les deux cas, le texte d'entrée devient la valeur courante de la commande.

sélection de fichier

Les éléments de contrôle de ce type permettent aux utilisateurs de sélectionner des fichiers, dont le contenu peut être transmis en même temps que la forme. Pour créer cet élément de commande en utilisant l'élément INPUT .

contrôles cachés

Les auteurs peuvent créer des contrôles qui ne sont pas présentés à l'utilisateur, mais ont des valeurs qui sont transmises à la forme. En règle générale, ils sont utilisés pour stocker l' échange d'informations entre le client / serveur, ce qui pourrait autrement être en raison de la nature apatride de l'abîme du protocole HTTP (voir. [RFC2068] ). Pour créer un contrôle caché éléments utilisent INPUT .

objets

Les auteurs sont autorisés à former des objets partagés, de sorte que les valeurs qui leur sont associées seront transférés à d'autres éléments de contrôle. Pour créer de tels éléments de contrôle utilisent l'OBJET .

Les éléments utilisés pour créer des contrôles qui sont généralement situés dans la cellule du FORM , mais peuvent être en dehors de l'annonce FORM , si elles sont utilisées pour construire l'interface utilisateur. Ceci est discuté dans la section sur les événements internes. Notez que contrôle formes en dehors peut ne pas être couronnée de succès .

17,3 Element FORMULAIRE

  <L'ELEMENT! Le FORMULAIRE - - ( bloc%; | SCRIPT) + - (FORM) - forme interactive ->
 <! FORMULAIRE DE ATTLIST
  % attrs;
  - % Coreattrs , % i18n , % events -
  l'action % l'URI;
  #REQUIRED - Formulaire gestionnaire sur le serveur -
  méthode (GET | POST) l'EEG - la méthode HTTP utilisée pour envoyer formy--
  le enctype % ContentType;
  "Application / x-www-form-urlencoded"
  le onsubmit % Script;
  #IMPLIED - Le formulaire a été soumis -
  onreset % Script;
  #IMPLIED - Le formulaire est remis à zéro -
  le charset-the accepter % Charsets;
  #IMPLIED - Liste des jeux de caractères supportés -
  >

Balise de début: obligatoire, balise fermante: obligatoire

Element FORM est un conteneur pour les contrôles . Il précise:

• forme mise en page (donnée par le contenu de l'élément).
• Le programme, qui sera traité et transmis sous forme zapolennuyu (attribut de l'action ). Recevoir la forme du programme devrait être en mesure de déterminer les paires nom / valeur pour les utiliser.
• Le procédé d'envoi de données vers le serveur (attribut méthode ).
• encodage de caractères qui doit être acceptée par le serveur pour gérer cette forme (attribut de l'accepter-charset ). Les agents utilisateurs peuvent informer l'utilisateur à la valeur de l'attribut accept-charset et / ou de ne pas permettre aux utilisateurs d'entrer des caractères non reconnus.

Apart formulaire contrôles peuvent inclure du texte et le balisage (paragraphes, listes, etc.).

  <FORM action = "http://somesite.com/prog/adduser" method = "post">
  ... Le contenu de la forme ...

  </ FORM>

  <FORM action = "mailto: [email protected]" method = "post">
  ... Le contenu de la forme ...

  </ FORM>

Pour plus d' informations sur la façon dont les agents utilisateurs doivent préparer des données de formulaire pour les serveurs et comment ils doivent gérer les réponses du serveur, s'il vous plaît se référer à la section sur la soumission du formulaire .

17,4 Element ENTRÉE

  <! ENTITY% InputType
  "(TEXT | MOT DE PASSE | CHECKBOX |
  RADIO |  SOUMETTRE |  RAZ |
  FILE |  HIDDEN |  IMAGE |  BUTTON) "
  >
 <! - Attribut est obligatoire pour tous les types sauf pour soumettre et réinitialiser ->
 <L'ELEMENT! L'entrée - A propos de VIDE Les - formes d'éléments de commande ->
 <! ATTLIST ENTREE
  % attrs;
  - % Coreattrs , % i18n , % events -
  du type % InputType;
  TEXT - le type de données d'entrée -
  nommer un CDATA #IMPLIED - passé dans le cadre de la forme -
  de la valeur d' un CDATA #IMPLIED - obligatoire pour les boutons de radio et de cases à cocher -
  Seulement vérifié (set) #IMPLIED - pour les boutons radio et cases à cocher -
  les personnes handicapées (personnes handicapées) #IMPLIED - indisponible dans ce contexte -
  l'readonly (lecture seule) #IMPLIED - pour le texte et les mots de passe -
  size un CDATA #IMPLIED - cela dépend du type du champ -
  le maxlength NUMÉRO #IMPLIED - le nombre maximum de caractères dans la zone de texte -
  src % l'URI;
  #IMPLIED - Pour les champs avec des images -
  alt un CDATA #IMPLIED - courte description -
  l'usemap % l'URI;
  #IMPLIED - Utilisation côté client image map -
  le tabindex NUMBER #IMPLIED - position dans l' ordre de tabulation -
  accesskey % du personnage;
  #IMPLIED - Touche d'accès -
  le onfocus % Script;
  #IMPLIED - L'accent sur cet élément -
  le onblur % Script;
  #IMPLIED - L'accent est déplacé vers un autre élément -
  onselect % Script;
  #IMPLIED - Certains texte est en surbrillance -
  le onchange % Script;
  #IMPLIED - La valeur de l'élément a changé -
  l'accepter % ContentTypes;
  #IMPLIED - Liste des types MIME pour le téléchargement de fichiers -
  >

Balise de début: requise, Balise de fin: interdite

17.4.1 types de contrôle créés avec l'élément INPUT

Type d'élément de commande défini par un élément de INPUT , en fonction de la valeur d'un attribut du type :

texte

Il crée une entrée de texte d'une seule ligne.

mot de passe

Même signification "texte", mais le texte d'entrée est présenté de façon à ne pas afficher des caractères (par exemple, comme une série d'étoiles). Cet élément de commande est souvent utilisé pour entrer des mots de passe. Notez que la valeur actuelle est le texte entré par l'utilisateur, et non le texte soumis par l'agent utilisateur.

Remarque. Les développeurs d'applications devraient prêter attention au fait que ce mécanisme ne fournit qu'une faible protection. Bien que le mot de passe est masqué par l' agent utilisateur d'observateurs occasionnels, il est transmis au serveur en texte clair, et peut être lu par toute personne ayant accès au réseau à un niveau bas.

case à cocher

Crée une case à cocher.

radio

Crée un bouton radio.

soumettre

Crée un bouton de soumission.

image

Crée un graphique bouton de soumission. La valeur de l'attribut src spécifie l'URI d'une image utilisée pour représenter le bouton. De raisons d'accessibilité, les auteurs doivent fournir un texte alternatif pour les images en utilisant l' attribut alt .

Si vous cliquez sur le dispositif de pointage de l' image est utilisée, le serveur transfère la forme et les coordonnées du clic. La valeur de x est mesurée en pixels à partir du bord gauche de l'image, et la valeur de y - en pixels à partir du haut de l' image. Les données transmises comprennent le nom .x = une séquence de valeur x et le nom .y = valeur-y, où «nom» - le nom d'attribut et de valeur-valeur x et y - valeurs de coordonnées x et y, respectivement.

Si le serveur prend différentes actions en fonction de l'endroit où vous cliquez, les utilisateurs de navigateurs non graphiques ne seront pas en mesure de tirer parti de cette propriété. Pour cette raison, les auteurs devraient envisager d'autres approches:

• Utilisez plusieurs boutons submit (chacune avec sa propre image) à la place d'un seul boutons graphiques. Il peut être utilisé pour contrôler l'emplacement de ces boutons feuille de style.
• Utilisez les images des cartes des clients et des scripts.

remettre

Crée un bouton de réinitialisation.

bouton

Créer un autre bouton. Les agents utilisateurs devraient être utilisés en tant que valeur de l' étiquette de la valeur d'attribut de bouton.

caché

Il crée un élément de contrôle invisible.

fichier

Crée un élément de contrôle de sélection de fichier . Les agents utilisateurs peuvent utiliser la valeur de l'attribut valeur comme nom de fichier d' origine.

17.4.2 Des exemples de formes avec les éléments de commande tels que ENTR

  <FORM action = "http://somesite.com/prog/adduser" method = "post">
  <P>
  Nom: <input type = "text" name = "prenom"> <BR>
  Nom de famille: <input type = "text" name = "nom"> <BR>
  email: <input type = "text" name = "email"> <BR>
  <Input type = "radio" nom = valeur "sexe" = "Homme"> Homme <BR>
  <Input type = "radio" nom = valeur "sexe" = "Femme"> Femme <BR>
  <Input type = "submit" value = "Envoyer"> <input type = "reset">
  </ P>
  </ FORM>

 <HEAD>
 <META http-equiv = "Content-Script-Type" content = "text / javascript">
 </ HEAD>
 <BODY>
  <FORM action = "..." method = "post">
  <P>
  <Input type = valeur "bouton" = "Cliquez ici" onclick = "verify ()">
  </ FORM>
 </ BODY>

 <FORM action = "http: //server.dom/cgi/handle"
  enctype = "multipart / form-data"
  method = "post">
  <P>
  Quel est votre nom?  <Input type = "text" name = "name_of_sender">
  Quels fichiers envoyez-vous?  <Input type = "file" name = "de name_of_files">
  </ P>
 </ FORM>

17.5 Element BUTTON

  <L'ELEMENT! Pour BUTTON - -
  ( % De débit; ) * - (A | % formctrl; | FORMULAIRE | le FIELDSET)
  - Bouton ->
 <! ATTLIST BUTTON
  % attrs;
  - % Coreattrs , % i18n , % events -
  nommer un CDATA #IMPLIED
  de la valeur d' un CDATA #IMPLIED - envoyé au serveur lors de l' envoi -
  du type (bouton | l'envoyer | la remise à zéro) de la présenter - pour une utilisation en tant que bouton de formulaire -
  les personnes handicapées (personnes handicapées) #IMPLIED - indisponible dans ce contexte -
  le tabindex NUMBER #IMPLIED - position dans la séquence perehoda--
  accesskey % du personnage;
  #IMPLIED - Touche d'accès -
  le onfocus % Script;
  #IMPLIED - L'accent mis sur un élément -
  le onblur % Script;
  #IMPLIED - L'accent est déplacé vers un autre élément -
  >

Balise de début: obligatoire, balise fermante: obligatoire

Boutons produits en utilisant l'élément BUTTON , agissent un peu comme un bouton créé par un élément ENTREE , mais ils fournissent un plus riches capacités de présentation: élément BUTTON peut avoir un contenu. Par exemple, l'élément BUTTON , contient une fonction d'image comme et peut ressembler élément INPUT , l'attribut Type est réglé sur "image", mais le type élément BUTTON peut avoir un contenu contenu.

Les agents utilisateurs visuels peuvent être des boutons BUTTON relief ou pousser effet sur clic de souris, tandis que la touche ENTRÉE ne peut être présenté comme une image " à plat".

  <FORM action = "http://somesite.com/prog/adduser" method = "post">
  <P>
  Nom: <input type = "text" name = "prenom"> <BR>
  Nom de famille: <input type = "text" name = "nom"> <BR>
  email: <input type = "text" name = "email"> <BR>
  <Input type = "radio" nom = valeur "sexe" = "Homme"> Homme <BR>
  <Input type = "radio" nom = valeur "sexe" = "Femme"> Femme <BR>
  <Nom du bouton = "submit" value = "Envoyer" type = "submit">
  Envoyer <IMG src = "/ icons / wow.gif" alt = "Wow"> </ BUTTON>
  <Nom du bouton = "reset" type = "reset">
  Réinitialiser <IMG src = "/ icons / oops.gif" alt = "second"> </ BUTTON>
  </ P>
  </ FORM>

Rappelez - vous, les auteurs doivent fournir un texte de remplacement pour l'élément images IMG .

Il est interdit d'associer une carte d'image avec un élément images IMG , soderzhaschimya l'élément à BUTTON élément.

 <BUTTON>
 <IMG src = "foo.gif" usemap = "...">
 </ BUTTON>

17.6 Les éléments de la commande SELECT , le OPTGROUP et OPTION

  <L'ELEMENT! Le SELECT - - (le OPTGROUP | OPTION) + - le sélecteur d'options ->
 <! ATTLIST SELECT
  % attrs;
  - % Coreattrs , % i18n , % events -
  nommer un CDATA #IMPLIED - nom du champ -
  lit NUMÉRO #IMPLIED - le nombre de lignes visibles -
  le multiple (multiple) #IMPLIED - une sélection est la valeur par défaut -
  les personnes handicapées (personnes handicapées) #IMPLIED - indisponible dans ce contexte -
  le tabindex NUMBER #IMPLIED - position dans l' ordre de tabulation -
  le onfocus % Script;
  #IMPLIED - L'accent déplacé vers l'article -
  le onblur % Script;
  #IMPLIED - L'accent élément est intervenu -
  le onchange % Script;
  #IMPLIED - La valeur de l'élément a changé -
  >

Balise de début: obligatoire, balise fermante: obligatoire

Element SELECT crée un menu de . Chaque élément du menu d'options apparaît OPTION . Élément SELECT doit contenir au moins un élément de l'OPTION .

Élément du OPTGROUP élément permet aux auteurs de choix des groupes logiquement. Habituellement, il est utile si un utilisateur de faire un choix dans une longue liste d'options; un groupe d'options connexes plus facile à parcourir et rappelez-vous qu'une seule longue liste d'options. Dans HTML 4.0 tous les éléments OPTGROUP doit être réglé directement dans la cellule SELECT (ie, les groupes ne peuvent pas être imbriqué).

17.6.1 Options présélectionnées

Les options peuvent être sélectionnées à l'avance. Les agents utilisateurs devraient déterminer les options qui sont sélectionnés comme suit:

• Si pour tout élément OPTION pas définir l' attribut sélectionné , ni option est sélectionnée à l' avance.
• Si un élément OPTION attribut défini sélectionné , cette option doit être sélectionnée Sarnen.
• Si un élément SELECT attribut défini plusieurs éléments, et plusieurs pour l' OPTION ensemble d' attributs sélectionnés , ils doivent être choisis à l' avance.
• Il est une erreur si pour certains éléments OPTION définir l' attribut sélectionné , et l'élément SELECT est pas défini attribut multiple . Les agents utilisateurs peuvent varier dans la façon de gérer cette erreur, mais ne devrait pas pré-sélectionner plus d'une option.

  <L'ELEMENT! Le OPTGROUP - - (OPTION) + - un groupe d'options ->
 <! ATTLIST OPTGROUP
  % attrs;
  - % Coreattrs , % i18n , % events -
  les personnes handicapées (personnes handicapées) #IMPLIED - indisponible dans ce contexte -
  l'étiquette % du texte;
  #REQUIRED - Utiliser dans les menus hiérarchiques -
  >

Balise de début: obligatoire, balise fermante: obligatoire

  <L'ELEMENT! Le OPTION - A propos de (#PCDATA) - sélectionner une option ->
 <! ATTLIST OPTION
  % attrs;
  - % Coreattrs , % i18n , % events -
  sélectionné (sélectionné) #IMPLIED
  les personnes handicapées (personnes handicapées) #IMPLIED - indisponible dans ce contexte -
  l'étiquette % du texte;
  #IMPLIED - Utilisé dans les menus hiérarchiques -
  de la valeur d' un CDATA #IMPLIED - par défaut - élément de contenu -
  >

Balise de début: requise, Balise de fin: en option

En présentant le menu de l' article , les agents utilisateurs devraient utiliser la valeur de l'attribut étiquette élément OPTION en option. Si cet attribut est pas spécifié, les agents utilisateurs devraient utiliser le contenu de l'élément OPTION .

Attribut étiquette élément OPTGROUP définit les versions de l' étiquette du groupe.

  <FORM action = "http://somesite.com/prog/component-select" method = "post">
  <P>
  <SELECT taille multiple = "4" name = "composant sélectionner">
  <OPTION sélectionnée value = "Component_1_a"> Programma_1 </ OPTION>
  <OPTION sélectionnée value = "Component_1_b"> Le programme _2 </ OPTION>
  <OPTION> Programme _3 </ OPTION>
  <OPTION> Programme _4 </ OPTION>
  <OPTION> Programme _5 </ OPTION>
  <OPTION> Programme _6 </ OPTION>
  <OPTION> Programme _7 </ OPTION>
  </ SELECT>
  <Input type = "submit" value = "Envoyer"> <input type = "reset">
  </ P>
 </ FORM>

  <FORM action = "http://somesite.com/prog/someprog" method = "post">
  <P>
  <SELECT name = "Comos">
  <Label OPTGROUP = "PortMaster 3">
  <OPTION label = "3.7.1" value = "pm3_3.7.1"> PortMaster 3 et COMOS 3.7.1
  <OPTION label = "3.7" value = "pm3_3.7"> PortMaster 3 et COMOS 3.7
  <OPTION label = "3.5" value = "pm3_3.5"> PortMaster 3 et COMOS 3.5
  </ OPTGROUP>
  <Label OPTGROUP = "PortMaster 2">
  <OPTION label = "3.7" value = "pm2_3.7"> PortMaster 2 et COMOS 3.7
  <OPTION label = "3.5" value = "pm2_3.5"> PortMaster 2 et COMOS 3.5
  </ OPTGROUP>
  <OPTGROUP label = "IRX">
  <Label OPTION = "3.7R" value = "IRX_3.7R"> IRX et Comos 3.7R
  <Label OPTION = "3,5R" value = "IRX_3.5R"> IRX et Comos 3,5R
  </ OPTGROUP>
  </ SELECT>
 </ FORM>

  PortMaster 3
  3.7.1
  3.7
  3.5
  PortMaster 2
  3.7
  3.5
  IRX
  3.7R
  3,5R

17,7 Element TEXTAREA

  <L'ELEMENT! Le TEXTAREA - - (#PCDATA) - champ de plusieurs lignes de texte ->
 <! ATTLIST TEXTAREA
  % attrs;
  - % Coreattrs , % i18n , % events -
  nommer un CDATA #IMPLIED
  lignes NOMBRE #REQUIRED
  le col NUMÉRO #REQUIRED
  les personnes handicapées (personnes handicapées) #IMPLIED - indisponible dans ce contexte -
  le readonly (le readonly) #IMPLIED
  le tabindex NUMBER #IMPLIED - position dans l' ordre de tabulation -
  accesskey % du personnage;
  #IMPLIED - Touche d'accès -
  le onfocus % Script;
  #IMPLIED - L'accent déplacé vers l'élément -
  le onblur % Script;
  #IMPLIED - L'accent déplacé vers un autre élément -
  onselect % Script;
  #IMPLIED - Certains texte est en surbrillance -
  le onchange % Script;
  #IMPLIED - La valeur de l'élément a changé -
  >

Balise de début: obligatoire, balise fermante: obligatoire

Element TEXTAREA crée un élément de commande pour plusieurs lignes de saisie de texte . Les agents utilisateurs devraient utiliser le contenu de cet élément comme la valeur initiale de l'élément de commande et de soumettre le texte en premier.

 <FORM action = "http://somesite.com/prog/text-read" method = "post">
  <P>
  <Textarea name = "lignes de theText" = "20" cols = "80">
  La première ligne du texte source.
  La deuxième ligne du texte source.
  </ TEXTAREA>
  <Input type = "submit" value = "Envoyer"> <input type = "reset">
  </ P>
 </ FORM>

17,8 Element ISINDEX

ISINDEX est indésirable . Cet élément crée un élément de commande pour le texte d'une seule ligne. Les auteurs devraient utiliser pour créer des contrôles pour le texte élément INPUT .

La définition formelle de cm. En Transitional la DTD .

Element ISINDEX crée un élément de commande pour le texte d'une seule ligne, dans laquelle vous pouvez entrer un numéro simvlov. Les agents utilisateurs peuvent utiliser la valeur de l'attribut invite dans une requête.

  <ISINDEX prompt = "Entrez la phrase de recherche:">

  <FORM action = "..." method = "post">
 <P> Entrez la phrase de recherche: <input type = "text"> </ P>
 </ FORM>

17.9 Balises

Avec certains contrôles de formulaire peuvent se connecter automatiquement des balises (par exemple, des boutons), avec d'autres éléments de la marque ne sont pas liés (champs de texte, cases à cocher, et la fixation à charge, et le bouton de menu).

Pour les contrôles avec des étiquettes implicites, les agents utilisateurs devraient être utilisés comme un attribut de valeur d'étiquette.

Element LABEL est utilisé pour définir des étiquettes pour les contrôles sans étiquettes implicites.

17.9.1 Element LABEL

  <L'ELEMENT! Le LABEL - - ( % inline; ) * - (LABEL) - champ sous forme de balise de texte ->
 <! ATTLIST LABEL
  % attrs;
  - % Coreattrs , % i18n , % events -
  pour IDREF, #IMPLIED - coïncide avec la valeur du champ ID -
  accesskey % du personnage;
  #IMPLIED - Touche d'accès -
  le onfocus % Script;
  #IMPLIED - L'accent déplacé vers l'élément -
  le onblur % Script;
  #IMPLIED - L'accent déplacé vers un autre élément -
  >

Balise de début: obligatoire, balise fermante: obligatoire

Elément LABEL peut être utilisé pour fixer des informations sur les éléments de contrôle. Chaque élément du LABEL associé à exactement un contrôle de formulaire.

Attribut pour explicitement lie l'étiquette à un autre élément de commande: une valeur d'attribut pour doit correspondre à la valeur de l'attribut id élément de commande associé. Avec le même élément de commande peut être connecté à plusieurs éléments LABEL , si vous créez des liens multiples avec l'attribut pour .

 <FORM action = "..." method = "post">
 <TABLE>
  <TR>
  <TD> <label for = "fname"> Nom </ LABEL>
  <TD> <input type = "text" name = "prenom" id = "fname">
  <TR>
  <TD> <label for = "lname"> Nom </ LABEL>
  <TD> <input type = "text" name = id "lastname" = "lname">
 </ TABLE>
 </ FORM>

  <FORM action = "http://somesite.com/prog/adduser" method = "post">
  <P>
  <Label for = "prenom"> Nom: </ LABEL>
  <Input type = "text" id = "prenom"> <BR>
  <Label for = "nom"> Nom: </ LABEL>
  <Input type = "text" id = "nom"> <BR>
  <Label for = "email"> email: </ LABEL>
  <Input type = "text" id = "email"> <BR>
  <Input type = "radio" nom = valeur "sexe" = "Homme"> Homme <BR>
  <Input type = "radio" nom = valeur "sexe" = "Femme"> Femme <BR>
  <Input type = "submit" value = "Envoyer"> <input type = "reset">
  </ P>
  </ FORM>

Pour associer implicitement une étiquette avec un autre élément de commande, l'élément de commande doit être dans la cellule du LABEL . Dans ce cas, l'élément LABEL peut comprendre un seul élément de commande. L'étiquette elle-même peut être placé avant ou après l'élément de commande associé.

 <FORM action = "..." method = "post">
 <P>
 <LABEL>
  nom
  <Input type = "text" name = "prenom">
 </ LABEL>
 <LABEL>
  <Input type = "text" name = "nom">
  nom de famille
 </ LABEL>
 </ P>
 </ FORM>

Si l' élément LABEL déplace la mise au point , elle est transmise à l'élément d'actionnement associé. Pour des exemples, voir. Ci - dessous dans la section sur l' accès au clavier .

Les étiquettes peuvent être présentées par les agents utilisateurs de plusieurs façons (par exemple, visuellement, lu par des synthétiseurs vocaux, etc.)

17.10 Ajout structure formes: les éléments FIELDSET et LEGEND

  <! -
  #PCDATA Est utilisé pour résoudre le problème de contenu mixte,
  selon la spécification que des espaces est autorisé là!
  ->
 <L'ELEMENT! Le FIELDSET - - (# PCDATA, LEGEND, ( flux%; ) *) - un groupe de contrôles de formulaire ->
 <! ATTLIST FIELDSET
  % attrs;
  - % Coreattrs , % i18n , % events -
  >
 <! ELEMENT LEGEND - - ( % de la ligne; ) * - ensemble de champs de légende ->
 <ENTITY% LALIGN "(top | bottom | left | right)"!>
 <! ATTLIST LEGEND
  % attrs;
  - % Coreattrs , % i18n , % events -
  accesskey % du personnage;
  #IMPLIED - Touche d'accès -
  >

Balise de début: obligatoire, balise fermante: obligatoire

Element FIELDSET permet aux auteurs de balises et des commandes de groupe sur les thèmes liés. commandes Regroupement rend plus facile pour les utilisateurs à comprendre les éléments de destination, tout en simplifiant la transition sur la touche de tabulation pour les agents utilisateurs visuels et de navigation vocale pour les agents utilisateurs audio. L'utilisation correcte de cet élément augmente la disponibilité des documents.

Element LEGEND permet aux auteurs d'attribuer un élément d' en- tête du FIELDSET . Légende augmente la disponibilité, si l'article FIELDSET semble non-visuelle.

  <FORM action = "..." method = "post">
  <P>
  <FIELDSET>
  <LEGEND> Informations personnelles </ LEGEND>
  Nom de famille: <INPUT name = type "personal_lastname" = "text" tabindex = "1">
  Nom: <INPUT name = type "personal_firstname" = "text" tabindex = "2">
  Adresse: <INPUT name = type "personal_address" = "text" tabindex = "3">
  ... D' autres renseignements personnels ... </ FIELDSET>

  <FIELDSET>
  <LEGEND> Case History </ LEGEND>
  <Input name = "history_illness" 
  type = "checkbox" 
  value = tabindex "Variole" = "20"> Variole
  <Input name = "history_illness" 
  type = "checkbox" 
  value = "Oreillons" tabindex = "21"> Oreillons
  <Input name = "history_illness" 
  type = "checkbox" 
  value = "Vertiges" tabindex = "22"> Vertiges
  <Input name = "history_illness" 
  type = "checkbox" 
  value = tabindex "éternuement" = "23"> Éternuements
  ... Plus d' histoire ...

  </ FIELDSET>
  <FIELDSET>
  <LEGEND> Traitement actuel </ LEGEND>
  Êtes-vous actuellement des médicaments? 
  <Input name = "medication_now" 
  type = "radio" 
  value = "Oui" tabindex = "35"> Oui
  <Input name = "medication_now" 
  type = "radio" 
  value = "Non" tabindex = "35"> Non

  Si oui, les énumérer ci-dessous:
  <Textarea name = "current_medication" 
  rangs = "20" cols = "50"
  tabindex = "40">
  </ TEXTAREA>
  </ FIELDSET>
 </ FORM>

17.11 Déplacer le focus sur un élément

Le document HTML, pour devenir actif et accomplir sa tâche est de recevoir de l'utilisateur mise au point. Par exemple, les utilisateurs doivent activer un lien défini par un élément de A , pour aller au document lié. De même, les utilisateurs doivent se concentrer sur un élément de la TEXTAREA , pour être en mesure de saisir du texte en elle.

Il y a plusieurs façons de se concentrer l'élément de transmission:

• Spécifiez l'élément avec le dispositif de pointage.
• Sauter d'un élément à un autre en utilisant le clavier. L'auteur du document peut définir un entonnoir définissant une procédure pour obtenir des éléments de mise au point lorsque l'utilisateur navigue à travers le document à l' aide du clavier (voir. Aller à la touche de tabulation ). L'élément sélectionné peut être activé à l'aide d'une séquence de touches différentes.
• Sélectionnez un élément en utilisant la clé d'accès (parfois appelé "raccourci clavier").

17.11.1 Déplacement avec la touche Tab

séquence de transition détermine l'ordre des éléments le recevra lors du passage du clavier. Un entonnoir peut comprendre des éléments imbriqués dans d'autres éléments.

Aller à des éléments qui peuvent recevoir le focus doit être effectuée par les agents utilisateurs en conformité avec les règles suivantes:

1. Aller aux éléments de support de l'attribut de l'tabindex , qui est attribué une valeur positive, il doit être effectué en premier. Transition est faite à partir des éléments avec la plus faible valeur de l'attribut tabindex à des éléments avec la plus grande valeur. Les valeurs ne doivent pas nécessairement être cohérent et ne pas avoir à commencer par une valeur particulière. Déplacer les éléments avec les mêmes valeurs de l'attribut tabindex doit être effectuée dans l'ordre de leur emplacement dans le flux de caractères.
2. Aller aux éléments qui ne supportent pas l'attribut tabindex ou éléments qui ont cette valeur d'attribut est "0", est réalisée dans le tour suivant. La transition est faite à ces éléments afin de leur emplacement dans le flux de caractères.
3. Disabled éléments ne participent pas à l'ordre de tabulation.

Les éléments suivants prennent en charge l'attribut de l'tabindex : A , AREA , à BUTTON , INPUT , OBJECT , SELECT et le TEXTAREA .

  <! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.0 // EN"
  "Http://www.w3.org/TR/REC-html40/strict.dtd">
 <HTML>
 <HEAD>
 <TITLE> document FORM </ TITLE>
 </ HEAD>
 <BODY>
 ... Du texte ... <P> Visite
 <A Tabindex="10" du site de la W3C. </A>
 plus ... texte ... <type BUTTON = "button" name = "get-base de données"
  tabindex = "1" onclick = "get-base de données">
 La base de données actuelle.
 </ BUTTON>
 ... Plus texte ...

 <FORM action = "..." method = "post">
 <P>
 <INPUT tabindex = "1" type = "text" name = "champ1">
 <INPUT tabindex = "2" type = "text" name = "field2">
 <INPUT tabindex = type "3" = "submit" name = "submit">
 </ P>
 </ FORM>
 </ BODY>
 </ HTML>

17.11.2 Les touches d'accès

En appuyant sur une touche d'accès affectée à un élément envoie un foyer de l' élément. L'action se produisant lors de la réception de l'élément de mise au point en fonction de l'élément. Par exemple, si une liaison active polzvoatel définie par l'élément A , l'agent utilisateur donne généralement une liaison de transition. Si un utilisateur active un bouton radio, l'agent utilisateur modifie la valeur d'un bouton. Si l'utilisateur active un champ de saisie de texte est autorisée à elle, etc.

Les éléments suivants prennent en charge l'attribut accesskey : A , AREA , à BUTTON , INPUT , LABEL , LEGEND , et l'TEXTAREA .

 <FORM action = "..." method = "post">
 <P>
 <Label for = "fixeur" accesskey = "U">
 Nom d'utilisateur
 </ LABEL>
 <Input type = "text" name = "user" id = "fixeur">
 </ P>
 </ FORM>

  <P> <A accesskey = "C" 
  rel = "contenu"
  href = "http://someplace.com/specification/contents.html">
  Sommaire </A>

L'utilisation des clés d'accès dépend du système. Par exemple, sur les ordinateurs exécutant MS Windows en général avec la clé d'accès, vous devez appuyer sur "alt". "Cmd" appuyer sur la touche est généralement nécessaire dans les systèmes Apple.

Représentation des clés d'accès dépend de l'agent utilisateur. Les auteurs sont encouragés à inclure la clé d'accès au texte de l'étiquette ou partout où la clé d'accès est utilisé. Les agents utilisateurs devraient rendre la valeur d'une clé d'accès de façon à mettre l'accent sur son rôle et de le distinguer des autres caractères (par exemple, par un trait de soulignement).

17.12 contrôles handicapés et des éléments de la lecture seule

Dans les contextes où l'entrée d'utilisateur n'a pas souhaité ou requis, il est important la possibilité de désactiver l'élément de commande ou de la présentation de sa lecture seule. Par exemple, vous pouvez désactiver le bouton d'envoi pour entrer des données requises. De même, l'auteur peut inclure texte en lecture seule à transmettre à la forme en tant que valeur. Les sections suivantes décrivent les contrôles handicapés, et des éléments de la lecture seule.

17.12.1 contrôles handicapés

Si l'attribut est désactivé est réglé, il affecte l'élément comme suit:

• éléments Désactiver ne passe pas le focus .
• Les éléments désactivés ne participent pas à la transmission de la touche de tabulation .
• contrôles handicapés ne peuvent pas être couronnée de succès .

Attribut désactivé support , les éléments suivants: de BUTTON l'ENTREE , l'optgroup , l'option , le SELECT et le TEXTAREA .

Cet attribut est héritée, mais des déclarations locales remplacent la valeur héritée.

Présentation des éléments déconnectés dépend de l'agent utilisateur. Par exemple, certains agents utilisateurs "gris isolés" éléments de menu handicapés, les étiquettes des boutons, etc.

 <INPUT désactivé nom = valeur "fred" = "pierre">

17.12.2 Contrôles en lecture seule

Attribut readonly détermine si l'utilisateur peut modifier le contenu de la commande.

Si l'attribut readonly installé, il influe sur l'élément comme suit:

• Les éléments de la lecture seule des interrupteurs au centre , mais l'utilisateur ne peut pas les changer.
• des éléments en lecture seule sont inclus dans la séquence de transition .
• Éléments en lecture seule peuvent être couronnée de succès .

Attribut readonly soutenir les éléments suivants: l'ENTRÉE , le texte, le mot de passe et le TEXTAREA .

Présentation des éléments de lecture dépend uniquement de l'agent utilisateur.

17.13 soumission de formulaire

Les sections suivantes expliquent les agents des agents de traitement de la forme de données d'utilisateur du formulaire de transfert.

17.13.1 méthode d'envoi forme

Attribut Méthode élément FORM spécifie la méthode HTTP utilisée pour soumettre le formulaire à l'agent de traitement. Cet attribut peut prendre deux valeurs:

• Accès: En utilisant la méthode de HTTP "get" ensemble de données de formulaire est ajouté à l'URI, un attribut spécifié l' action , et ce nouvel URI est envoyé à l'agent de traitement.
• après: Utilisation de la méthode de HTTP "post" forme l'ensemble de données est inclus dans le corps de la forme et envoyé à l'agent de traitement.

"Get" méthode doit être utilisée si le formulaire est idempotent (ie, provoque pas d'effets secondaires). Un grand nombre d'opérations de recherche ne sont pas dans la base de données visible des effets secondaires et est une application idéale pour la méthode "get".

Si le service associé au traitement des formes, provoque des effets secondaires (par exemple, si la forme modifie une base de données ou de souscription fait M. Services), utilisez la méthode "post".

17.13.2 contrôles réussis

élément de commande réussie "correspond" à envoyer. Chaque élément de contrôle réussie a un nom , et la valeur actuelle ; cette paire fait partie de la transmission et sous forme de données . élément de contrôle réussie doit être défini dans l'élément FORM et doit avoir un nom.

Cependant:

• Disabled contrôles ne peuvent pas être couronnée de succès.
• Si le formulaire contient plusieurs boutons soumettre , le succès est seulement le bouton activé.
• Le succès peut tous être "sur" cases .
• Pour les boutons radio avec la même valeur de l'attribut nom , le succès ne peut être "sur" bouton.
• Pour le menu nom de l' élément de commande élément donné SELECT , et les valeurs - les éléments de l'OPTION . Le succès peut être que des objets sélectionnés.
• La valeur actuelle de l'élément de sélection de fichier est une liste d'un ou plusieurs noms de fichiers. Après avoir soumis le formulaire contenu de chaque fichier est transmis au reste des données de formulaire. Le contenu du fichier est emballé conformément au type de contenu du formulaire.
• La valeur actuelle de l'objet de contrôle est un objet d'implémentation.

Если управляющий элемент не имеет текущего значения во время отправки формы, агенты пользователей не обязательно должны обрабатывать его как успешный.

En outre, les agents utilisateurs ne devraient pas considérer les contrôles suivants avec succès:

• Bouton de réinitialisation.
• Éléments de l'OBJET , dont l' attribut est défini sur le déclarer .

contrôles cachés et des contrôles qui ne sont pas soumis à travers les feuilles de style peuvent réussir. Par exemple:

  <FORM action = "..." method = "post">
 <P>
 <Input type = "password" style = "display: none" 
  name = "invisible mot de passe"
  value = "mypassword">
 </ FORM>

17.13.3 forme Traitement des données

Lorsqu'un utilisateur soumet un formulaire (par exemple, en activant un bouton de soumission ), l'agent utilisateur traite comme suit.

La première étape: Identifier les contrôles réussis  

Deuxième étape: Construire l'ensemble de données de formulaire  

Formulaire ensemble de données - est une séquence de paires nom / valeur compilée à partir des contrôles réussis

Troisième étape: Coder l'ensemble de données de formulaire  

Ensuite , former un ensemble de données est codé en fonction du type de contenu , défini attribut enctype élément FORM .

Quatrième étape: Transférer les données sous forme ensemble codé  

Enfin, les données codées sont envoyées à l'agent de traitement désigné attribuer l'action , selon le protocole indiqué dans l'attribut procédé .

Cette spécification ne définit pas toutes les méthodes de livraison valides ou types de contenu qui peuvent être utilisés avec des formes. Cependant, les agents utilisateurs doivent prendre en charge HTML 4.0 fixé par un accord dans les cas suivants:

• Si l'attribut méthode est définie pour «obtenir», et d'attribuer une action URI Set de HTTP, l'agent utilisateur prend l'attribut de valeur l' action , ajoute un «? Et puis ajoute un ensemble de données de formulaire codées en utilisant le type de contenu "application / x-www-form -urlencoded". Ensuite, l'agent utilisateur transmet le lien vers cet URI. Dans ce scénario, les données de formulaire sont limitées à des codes ASCII.
• Si l'attribut méthode est réglé sur "post", mais d'attribuer une action - HTTP l'URI, l'agent utilisateur effectue une requête HTTP transaction "post" avec la valeur d'attribut l' action et le message créé en fonction du type de contenu spécifié dans l'attribut de l'enctype l'attribut.

Pour les autres valeurs d'attribut actions ou méthode comportement est indéfini.

Les agents utilisateurs sont tenus de soumettre une réponse à la transaction HTTP "get" et "post".

17.13.4 Types de contenu sous forme

Attribut enctype élément FORM spécifie le type de contenu utilisé pour coder les ensembles de données de formulaire pour la transmission au serveur. Les agents utilisateurs doivent prendre en charge les types de contenu ci-dessous. Comportement pour d'autres types de contenu ne sont pas définis.

Voir. Aussi la section sur l' utilisation esperluette dans les valeurs d'attribut URI .

application / x-www-form- urlencoded  

Ce type de contenu est utilisé par défaut. Forme, avec le type de contenu transmis doit être codé comme suit:

1. Les noms et les valeurs des éléments de commande sont échappés. Les caractères non-imprimables sont remplacés par `+ ', et les personnages alors réservés sont échappés, comme décrit dans [RFC1738] , Section 2.2: caractères nonarithmetic sont remplacés by`% HH', un signe pour cent, suivi de chiffres hexadécimaux représentant le caractère ASCII-Code. Les sauts de ligne sont représentés par paires "CR LF" (ie, `% 0D% 0A»).
2. Les noms / valeurs des contrôles répertoriés dans l'ordre dans lequel ils apparaissent dans le document. Le nom est séparé de la valeur par un caractère `= 'et les paires nom / valeur sont séparées les unes des autres by` &'.

/ Form-data multipart  

Tapez "application / x-www-form-urlencoded" est inefficace pour l'envoi de grandes quantités de données binaires ou texte contenant des caractères en dehors du jeu ASCII. "Multipart / form-data" de type doit être utilisé pour la présentation des formulaires qui contiennent des fichiers, ces non-ASCII et des données binaires.

Le contenu "multipart / form-data" utilisé par les règles de toutes les données composant ruisseaux MIME, comme décrit dans [RFC2045] . Déterminer le type de "multipart / form-data" peut être trouvée dans le registre [IANA] .

Type "multipart / form-data" message se compose de plusieurs parties, dont chacune est des contrôles réussis . Une partie de l'agent de traitement sont envoyés dans l'ordre dans lequel les éléments de commande respectifs sont représentés dans le flux du document. Borders parties ne doivent pas être dans la base de données; assurer cette exigence est en dehors du domaine de cette spécification.

Comme avec tous les types de MIME composite, chaque partie a un en-tête en option "Content-Type", pour lequel la valeur par défaut est réglé sur "text / plain". Les agents utilisateurs devraient fournir le titre de "Content-Type" avec le paramètre "charset".

Chaque partie doit contenir:

1. header "Content-Disposition", ayant une valeur de "form-data".
2. nommant attribut qui définit le nom de l'élément de commande correspondant. Les noms des contrôles à l' origine codées en utilisant des jeux de caractères autres que ASCII, peut être codé en utilisant la méthode décrite dans [RFC2045] .

Par exemple, l'élément de commande à "MyControl" le nom de la partie correspondante pourrait ressembler à ceci:

  Content-Disposition: form-data;  name = "MyControl"

Comme dans toutes les données traite le transfert MIME, à des lignes de données séparées, une combinaison de "CR LF" (ie, `% 0D% 0A»).

Peut coder chaque partie indiquant l' en- tête "Content-Transfer-Encoding", si la valeur de cette partie ne correspond pas à l'encodage par défaut (7BIT) (voir. [RFC2045] , Section 6)

Si le contenu du fichier est transféré à la forme, l'entrée de fichier doit être déterminé par le lieu le type de contenu (par exemple, "application / octet-stream" ). Si le résultat d'un élément de formulaire à renvoyer plusieurs fichiers, ils doivent être retournés comme un type de "multipart / mixed", intégré dans le "multipart / form-data".

L'agent utilisateur doit tenter de fournir un nom pour chaque transfert de fichier. Le nom du fichier peut être spécifié dans le paramètre "filename" header "Content-Disposition: form-data» ou, dans le cas de plusieurs champs dans l'en-tête «Content-Disposition: fichier 'partie. Si le nom du fichier du système d'exploitation client contient des caractères qui ne sont pas inclus dans l'ensemble de l' US-ASCII, le nom du fichier peut être modifié ou codé en utilisant la méthode de [RFC2045] . Ceci est utile lorsque, par exemple, les fichiers téléchargés peuvent contenir des références à l'autre (par exemple, fichier TeX et sa description accessoire de styles ".sty").

L'exemple suivant montre codant "multipart / form-data". Supposons que nous ayons la forme suivante:

  <FORM action = "http: //server.dom/cgi/handle"
  enctype = "multipart / form-data"
  method = "post">
  <P>
  Quel est votre nom?  <Input type = "text" name = "submit-name"> <BR>
  Quels fichiers envoyez-vous?  <input type = "file" name = "fichiers"> <BR>
  <Input type = "submit" value = "Envoyer"> <input type = "reset">
  </ FORM>

Si l'utilisateur entre le mot «Larry» et sélectionne le fichier texte "file1.txt" dans le champ de texte, l'agent utilisateur peut envoyer les données suivantes:

  Content-Type: multipart / form-data;  boundary = AaB03x
  --AaB03x
  Content-Disposition: form-data;  name = "submit-name"
  Larry
  --AaB03x
  Content-Disposition: form-data;  name = "fichiers";  filename = "file1.txt"
  Content-Type: text / plain
  ... Le contenu du fichier file1.txt ...
  --AaB03x--

Si l'utilisateur sélectionne le second fichier (image) "file2.gif", l'agent utilisateur peut construire les parties comme suit:

  Content-Type: multipart / form-data;  boundary = AaB03x
  --AaB03x
  Content-Disposition: form-data;  name = "submit-name"
  Larry
  --AaB03x
  Content-Disposition: form-data;  name = "fichiers"
  Content-Type: multipart / mixed;  boundary = BbC04y
  --BbC04y
  Content-Disposition: attachment;  filename = "file1.txt"
  Content-Type: text / plain
  ... Le contenu du fichier file1.txt ...
  --BbC04y
  Content-Disposition: attachment;  filename = "file2.gif"
  Content-Type: image / gif
  Content-Transfer-Encoding: binary
  ... Le contenu du fichier file2.gif ...
  --BbC04y--
  --AaB03x--