Télécharger la présentation
La présentation est en train de télécharger. S'il vous plaît, attendez
Publié parJoëlle Desmarais Modifié depuis plus de 6 années
1
Informatique de base Pr. Namar Ydriss Cours 4: Formulaires
Université Paris II Panthéon - Assas Informatique de base Cours 4: Formulaires 01/12/2018
2
Comment échanger de l’ information
Serveurs : Adresse IP Serveur http : programme qui attend des demandes de clients
3
Des clients et un serveur
Serveur HTTP Client1 Client Le serveur envoie un fichier à chaque client. Page d ’accueil index.html ou introduction.html
4
Mécanisme d’interaction
Formulaire Script CGI (Common Gateway Interface)
5
Serveur HTTP Logiciel Apache: www.apache.org IIS : www.microsoft.com
Client1
6
Formes en HTML <FORM>
Votre nom : <INPUT TYPE=" text " NAME= " nom " SIZE =" 15 " MAXLENGTH= " 12 " > <BR> Commentaires : <INPUT TYPE=" text " NAME= " com " ROWS =" 6 " COLS= " 70 " > </FORM>
7
Formes Votre nom : Commentaires:
8
Boutons en HTML <FORM> <OL>
<INPUT TYPE=" radio " NAME= " legenre " VALUE = " Windows " > <BR> <INPUT TYPE=" radio " NAME= " legenre " VALUE = " Mac " > <INPUT TYPE=" radio " NAME= " legenre " VALUE = " Unix " > </OL> </FORM>
9
Boutons radio et checkbox
Windows Mac Unix
10
Question d ’Examen <FORM NAME="ValidForm">
Q1 : Un entier A est représenté en binaire par et un entier B par Alors: <br> <INPUT NAME="Q1" TYPE="radio" onClick="q1_OnClick(1)"> A+B=127 en décimal <BR> <INPUT NAME="Q1" TYPE="radio" onClick="q1_OnClick(2)"> A=B+1 en décimal <INPUT NAME="Q1" TYPE="radio" onClick="q1_OnClick(3)"> A+B=255 en décimal <INPUT NAME="Q1" TYPE="radio" onClick="q1_OnClick(4)"> A=B+11 en décimal </FORM NAME>
11
Boutons radio et checkbox
Q1 : Un entier A est représenté en binaire par et un entier B par Alors: A+B=127 A+B=1 A+B=255 A+B=11
12
Formulaires à menu déroulant
La balise SELECT met en place des menus déroulant. Si l'attribut SIZE="nombre d'options du menu", le menu est présenté déjà déroulé alors que si l'attribut SIZE est omis, le menu est présenté refermé. De quel continent êtes-vous ? <SELECT NAME="CONTINENT" SIZE="3"> <OPTION >Afrique<OPTION>Amérique<OPTION>Asie <OPTION SELECTED >Europe <OPTION>Océanie </SELECT>
13
Formulaire complet Les formulaires peuvent prendre la forme - d'une ligne de texte - d'une fenêtre de texte - de boutons radio la semaine le week-end - de cases à cocher la semaine le week-end - d'un menu déroulant
14
Exemple de Formulaire complet
<html><head><title>Untitled Document</title><meta http-equiv="Content-Type" content="text/html; charset=iso "></head> <body bgcolor="#FFFFFF"> <P><B>Les formulaires peuvent prendre la forme<BR> - <FONT COLOR="#000080">d'une ligne de texte</FONT></B><BR> <INPUT TYPE="text" NAME="NOM" VALUE="" SIZE=30></P> <P>- <B><FONT COLOR="#000080">d'une fenêtre de texte</FONT></B><BR> <TEXTAREA NAME="NOM" ROWS=4 COLS=60></TEXTAREA></P> <P>- <B><FONT COLOR="#000080">de boutons radio<BR> <INPUT TYPE="radio" NAME="BOUTON_RADIO " VALUE="VALEUR"></FONT></B>la semaine<BR> <INPUT TYPE="radio" NAME="BOUTON_RADIO " VALUE="VALEUR">le week-end</P> <P>- <B><FONT COLOR="#000080">de cases à cocher<BR> <INPUT TYPE="checkbox" NAME="CASE_A_COCHER583" VALUE="VALEUR"></FONT></B>la <INPUT TYPE="checkbox" NAME="CASE_A_COCHER58" VALUE="VALEUR">le week-end</P> <P>- <B><FONT COLOR="#000080">d'un menu déroulant</FONT></B><BR> <SELECT NAME="Quel jour?"><OPTION>lundi <OPTION>mardi <OPTION>mercredi <OPTION>jeudi <OPTION>vendredi <OPTION>samedi <OPTION>dimanche </SELECT></P> <P><B>A la suite du ou des formulaires, il y aura un bouton dont la fonction sera d'envoyer les messages (par exemple à votre adresse électronique).</B></P> </body></html>
15
Interface avec un serveur
CGI : Common Gateway Interface Scripts DHTML (Dynamic HTML) PRINCIPE : Paramètre Action de FORM Variables $x, $y si x et y sont les noms des variables. Bouton type=submit
16
Formes et CGI Votre nom : Commentaires: jean send
17
T.D. 4 Formulaires en HTML Radio, Checkbox, Button, Submit, Reset Select, Textarea Action d’un formulaire
Présentations similaires
© 2024 SlidePlayer.fr Inc.
All rights reserved.