1 / 15

Cours n° 4

Cours n° 4. وزارة التربية الوطنية والتعليم العالي وتكوين الأطر والبحث العلمي. الأكاديمية الجهوية للتربية و التكوين لجهة وادي الذهب وأوسرد. ثانوية للا خد يجة المرجعية. Lycée Lala Khadija Référentiel. Le langage HTML. Prof. : E. BAKKI. Année scolaire 2008/2009. Les formulaires.

slone
Télécharger la présentation

Cours n° 4

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Cours n° 4 وزارة التربية الوطنيةوالتعليم العالي وتكوين الأطروالبحث العلمي الأكاديمية الجهويةللتربية و التكوين لجهةوادي الذهب وأوسرد ثانوية للا خد يجة المرجعية Lycée Lala Khadija Référentiel Le langage HTML Prof. : E. BAKKI Année scolaire 2008/2009

  2. 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é).

  3. É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

  4. Les types d’éléments de formulaire

  5. 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

  6. 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

  7. 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

  8. 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&egrave;que <INPUT NAME="payer" TYPE="radio" VALUE="cc">Carte de cr&eacute;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

  9. 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

  10. 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

  11. 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

  12. 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

  13. 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

  14. Exemple de formulairefile <HTML> <BODY> <FORM METHOD=GET ACTION="http://www.monsite.com"> <INPUT TYPE=FILE NAME=Telechargement> </FORM> </BODY> </HTML> file.html

  15. FIN du cours 4

More Related