TP HTML 5 - les formulaires.
Réponse AJAX

Les tableaux

On peut faire des tableaux en HTML. Celui-ci est moche, mais on attendra d'aborder le CSS pour aligner le contenu, mettre des bordures, mettre des styles de fond. Pour l'instant, vous avez besoin des balises <table>, <tr>, <th>, <td>.

Pour bien comprendre l'exemple ci-dessus :

Dans ce site www.bts-sio.com, citez un exemple de page qui contient un tableau HTML (mettez son URL ou le titre de la page)

Votre réponse n°1

Ecrivez l'extrait de code HTML qui réalise le tableau suivant :

Votre réponse n°2

Les formulaires

Les formulaires permettent à l'internaute d'envoyer des données au serveur (pour inscription, authentification, formulaire de contact, post dans un forum ou un chat, etc.). Ces données seront ensuite traitées par le serveur.

Structure minimale d'un formulaire : la balise <form> et le bouton de validation

La structure minimale d'un formulaire est : Explications :

Les différents contrôles disponibles dans les formulaires

Testez chaque contrôle pour voir leur fonctionnement et comprendre leur utilité.

La zone de texte : <input type=text>

La zone de texte est utile pour saisir des textes courts (login, pseudo, nom, prénom, ville, n° de téléphone, URL, email, etc.). Dans une base de données de type MySQL elle est souvent associée au type varchar(255). Remarque : L'attribut name n'est indispensable que dans le but d'un traitement ultérieur (dans un langage de programmation comme PHP ou ASP.Net)
Postez un formulaire complet qui comporte une ou plusieurs zones de texte.
Votre réponse n°3
En cherchant sur Internet, expliquez de façon claire et concise le rôle de chacun de ces attributs applicables à la balise <input type=text> :
Votre réponse n°4

La zone de texte multiligne: <textarea></textarea>

La zone de texte multiligne est utile pour saisir des textes longs (message, commentaire, description, réponse à une question d'un TP, etc.). Dans une base de données de type MySQL elle est souvent associée au type text. Remarque : La valeur par défaut, contrairement aux autres contrôles, se place entre les balises <textarea> et </textarea>
En cherchant sur Internet, expliquez le rôle de la propriété cols et de la propriété rows pour la balise <textarea> :
Votre réponse n°5

La zone de texte pour mots de passe : <input type=password>

La zone de texte pour mot de passe permet une saisie discrète du mot de passe pour celui qui "regarde sur votre épaule". Attention si vous quittez votre poste de travail : cette sécurité est peu fiable et on peut afficher le mot de passe en clair en quatre clics.

Dans une base de données de type MySQL elle est souvent associée au type varchar(255).

La case à cocher : <input type=checkbox>

Utilisations typiques :

Dans une base de données de type MySQL, le contrôle case à cocher est souvent associé au type booléen (ou entier court - tinyint si le booléen n'existe pas).

En cherchant sur Internet, expliquez le rôle de la propriété checked et de la propriété value :
Votre réponse n°6
Si on n'utilise pas la propriété value, quelle est la valeur par défaut ?
Votre réponse n°7

Les boutons radio : <input type=radio>

Utilisations typiques :

Dans une base de données de type MySQL, le contrôle bouton radio est souvent associé au type enum (liste de valeurs prédéfinies) ou tinyint (entier court). Remarque importante : chaque groupe de bouton radio a son propre name=. Tous les boutons qui ont le même name= font partie du même groupe et on ne peut en cocher qu'un seul parmi tous ceux du groupe.

La zone de liste : <select></select>

Utilisations typiques :

Dans une base de données de type MySQL, le contrôle zone de liste est souvent une clé étrangère qui représente une clé primaire d'une autre table. On verra ces notions dans le cours sur les bases de données. Remarques :