150 likes | 359 Views
Cours n° 4. وزارة التربية الوطنية والتعليم العالي وتكوين الأطر والبحث العلمي. الأكاديمية الجهوية للتربية و التكوين لجهة وادي الذهب وأوسرد. ثانوية للا خد يجة المرجعية. Lycée Lala Khadija Référentiel. Le langage HTML. Prof. : E. BAKKI. Année scolaire 2008/2009. Les formulaires.
E N D
Cours n° 4 وزارة التربية الوطنيةوالتعليم العالي وتكوين الأطروالبحث العلمي الأكاديمية الجهويةللتربية و التكوين لجهةوادي الذهب وأوسرد ثانوية للا خد يجة المرجعية Lycée Lala Khadija Référentiel Le langage HTML Prof. : E. BAKKI Année scolaire 2008/2009
Les formulaires La création d’une formulaire se fait avec la balise <FORM ACTION="URL d'un script" METHOD="POST ou GET">// la description des différents éléments du formulaire</FORM> Avec ACTIONon désigne le fichier qui devra être exécuté une fois que l’utilisateur aura cliqué sur le bouton qui valide le formulaire. Avec METHODon précise le type de passage de paramètres : soit POST, soit GET (POST est plus souvent utilisé et conseillé, pour des raisons de sécurité).
Éléments de formulaire Zone de saisie : <INPUTNAME="identificateur de la zone" TYPE="Type de la zone"> • Le TYPEpeut être, notamment : • text (type par défaut) = une ligne de saisie • submit= le bouton de soumission du formulaire (validation) • reset= le bouton d’annulation du formulaire (remise à zéro) • radio= bouton radio (De 0 à N choix parmi N) • checkbox= case à cocher (1 choix parmi N) Pour créer une zone de texte, on utilise la balise textarea
Exemple de formulaire text <HTML> <BODY> Envoi du contenu du formulaire dans un <strong>mail</strong> destiné à machine@caramail.fr <FORM ACTION="mailto:machine@caramail.fr" METHOD="POST" NAME="Envoi_Mail"> Taper votre message ici : <input type="text" size="20" name="Commentaire"> <input type="submit" name="Bouton_Envoyer" value="Cliquer ici pour Envoyer"> </FORM> </BODY> </HTML> Formulaire.html
Exemple de formulairetext <HTML> <BODY> <FORM> <PRE> Votre Nom : <INPUT TYPE="text" NAME="Nom" SIZE="50"> Votre Courriel :<INPUT TYPE="text" NAME="E-mail" SIZE="50"> Votre Adresse : <INPUT TYPE="text" NAME="Adresse" SIZE="30"> <INPUT TYPE="text" NAME="suite_adresse" SIZE="30"> Votre CP : <INPUT TYPE="text" NAME="code postal" SIZE="5" MAXLENGTH=5> Votre Ville : <INPUT TYPE="text" NAME="ville" SIZE="50"> </PRE> <INPUT TYPE=RESET VALUE="Tout effacer"> <INPUT TYPE=SUBMIT VALUE="OK, c'est parti"> </FORM> </BODY> </HTML> Formulaire2.html
Exemple de formulaire textarea <HTML> <BODY> <FORM METHOD=POST ACTION="fichier_destination.asp"> <TEXTAREA NAME="unNom" ROWS=5 COLS=40> Contenu ... </TEXTAREA> <INPUT TYPE=SUBMIT VALUE="Envoyer le formulaire"> </FORM> </BODY> </HTML> Formulaire_textarea.html
Exemple de formulaireradio <HTML> <BODY> <B>Votre mode de paiement</B> <FORM> <INPUT NAME="payer" TYPE="radio" VALUE="comptant">Comptant <INPUT NAME="payer" TYPE="radio" VALUE="cheque">Chèque <INPUT NAME="payer" TYPE="radio" VALUE="cc">Carte de crédit <BR> <INPUT TYPE="RADIO" NAME="monnaie" VALUE="Francs"> En Francs <INPUT TYPE="RADIO" NAME="monnaie" VALUE="Euros" CHECKED> En Euros </FORM> </BODY> </HTML> formulaire_radio.html
Exemple de formulaireoption <HTML> <BODY> <FORM> <SELECT NAME="Club"> <OPTION VALUE="OM"> Marseille <OPTION VALUE="PSG"> Paris <OPTION VALUE="RC LENS"> Lens <OPTION SELECTED VALUE="LOSC"> Lille </SELECT> </FORM> </BODY> </HTML> formulaire_choix.html
Exemple de formulairesélection multiple <HTML> <BODY> <FORM> Quel type de Voiture ? <SELECT MULTIPLE NAME="all"> <OPTION VALUE="Porsche"> Porsche <OPTION VALUE="BMW"> BMW <OPTION VALUE="FIAT"> FIAT <OPTION VALUE="LOTUS"> LOTUS <OPTION VALUE="autre"> Autre choix </SELECT> </FORM> </BODY> </HTML> formulaire_autre_choix.html
Exemple de formulairecases à cocher <HTML> <BODY> Vous aimez : <FORM METHOD=GET ACTION="http://www.monsite.com"> <INPUT TYPE="CHECKBOX" NAME="aime" VALUE="Fric" CHECKED> L'argent <INPUT TYPE="CHECKBOX" NAME="aime" VALUE="Boire"> Bien Boire <INPUT TYPE="CHECKBOX" NAME="aime" VALUE="Manger"> Bien manger <INPUT TYPE="CHECKBOX" NAME="aime" VALUE="TV"> La télévision <INPUT TYPE="CHECKBOX" NAME="aime" VALUE="Info"> L'actualité <HR> Vous n'aimez pas : <BR> <INPUT TYPE="CHECKBOX" NAME="aimepas" VALUE="Fric"> L'argent <INPUT TYPE="CHECKBOX" NAME="aimepas" VALUE="Foule"> La foule <INPUT TYPE="CHECKBOX" NAME="aimepas" VALUE="Baston"> La violence <INPUT TYPE="CHECKBOX" NAME="aimepas" VALUE="TV"> La télévision <INPUT TYPE="CHECKBOX" NAME="aimepas" VALUE="Julien Lepers" CHECKED> Julien Lepers </FORM> </BODY> </HTML> cocher.html
Exemple de formulairecases à cocher + image Même code que pour cocher.html avec cette ligne en plus avant le </FORM> : <INPUT TYPE=IMAGE NAME=image-valider SRC="envoyer.bmp"> cocher-image.html
Exemple de formulairepassword <HTML> <BODY> <FORM METHOD=POST ACTION="verif.php"> Entrez votre login : <INPUT TYPE=Text NAME="login" SIZE=30> <BR> Entrez votre mot de passe : <INPUT TYPE=PASSWORD NAME="motdepasse" SIZE=30> <BR> <INPUT TYPE=reset Value="RAZ"> <INPUT TYPE=submit Value="VALIDER"> </FORM> </BODY> </HTML> password.html
Exemple de formulairefile <HTML> <BODY> <FORM METHOD=GET ACTION="http://www.monsite.com"> <INPUT TYPE=FILE NAME=Telechargement> </FORM> </BODY> </HTML> file.html