Scribd Logo
Importer

Bienvenue sur Scribd !

  • 43 vues

    2015 04 27 Atelier Web 5.2

    Transféré par

    hakima
    Le document décrit les formulaires HTML et la manipulation des données de formulaires avec PHP. Il contient des exemples de code et des exercices sur la création de formulaires, la transmission de données entre pages et la validation des données saisies.

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd

    2015 04 27 Atelier Web 5.2

    Transféré par

    hakima
    43 vues6 pages
    Le document décrit les formulaires HTML et la manipulation des données de formulaires avec PHP. Il contient des exemples de code et des exercices sur la création de formulaires, la transmission de données entre pages et la validation des données saisies.

    Titre original

    2015_04_27_Atelier_Web_5.2

    Copyright

    © © All Rights Reserved

    Formats disponibles

    PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Le document décrit les formulaires HTML et la manipulation des données de formulaires avec PHP. Il contient des exemples de code et des exercices sur la création de formulaires, la transmission de données entre pages et la validation des données saisies.

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Télécharger au format pdf ou txt
    43 vues6 pages

    2015 04 27 Atelier Web 5.2

    Transféré par

    hakima
    Le document décrit les formulaires HTML et la manipulation des données de formulaires avec PHP. Il contient des exemples de code et des exercices sur la création de formulaires, la transmission de données entre pages et la validation des données saisies.

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Télécharger au format pdf ou txt
    sur 6

    ISET Nabeul ATELIER WEB DYNAMIQUE

    TP5: LES FORMULAIRES


    OBJECTIFS :
    1. Manipulation des formulaires avec PHP.
    2. Transmission d'arguments entre pages : méthodes GET et POST.
    3. Manipulation du JavaScript avec le PHP.
    PARTIE 1: Formulaire HTML
    Les formulaires sont des ensembles de composants, qui permettent à l'utilisateur
    d'entrer des informations, d'exprimer ses choix, de saisir du texte…
    Un formulaire est contenu entre les balises <form> et </form>
    Ligne de texte:
    <form>
    <input type="text" name="Nom" size="25" maxlength="6"
    value="suissi"/>
    </form>
    Zone de texte:
    <textarea row="4" cols="25"> un texte </textarea> </p>
    Liste de sélection:
    <form>
    Donner votre pays:
    <select>
    <option> Algérie</option>
    <option> Tunisie</option>
    <option> France</option>
    <option> Autres</option>
    </select>
    </form>
    Boutons de choix multiple:

    Competences techniques: <br/>


    <input type="checkbox" name="j" checked="checked"/> Java
    <br/>
    <input type="checkbox" name="c"/> C/C++ <br/>
    <input type="checkbox" name="r"/> PHP et MySQL <br/>
    Bouton radio:

    <input type="radio" name="NewsLetter" value="Oui">Oui<br/>


    <input type="radio" name="NewsLetter" value="Non">Non
    Bouton d'envoi:

    <input type="submit"/> <br/>


    <input type="submit" value="cliquer moi!"/>
    <button type="submit">Enoyer <img src="go.gif"/></button>

    BEN ROMDHAN Mourad 1


    ISET Nabeul ATELIER WEB DYNAMIQUE

    APPLICATION :
    Ecrire un script HTML qui affiche une page contenant le formulaire suivant :
    Type de bien : chalet, villa, chambre, appartement
    Le champ calculer prix est égale à 0 par défaut

    PARTIE 2: Transmission des données


    1. Transmission des informations au serveur:
    Lorsqu’un client veut retourner des données au serveur Web, le navigateur utilise
    la procédure de transmission de formulaire, cette procédure est contrôlée par 2
    attributs de la balise <form> : method et action.
    L’attribut method détermine la manière dont les données sont transmises au
    serveur. Il peut prendre les valeurs GET et POST:
    ‒ POST: Les valeurs des champs sont passés dans l’entête de la requête. Les
    données ne sont pas visibles par l'internaute au moment de l'envoi.
    ‒ GET: Les valeurs des champs sont passés dans l’url. D’où, les données sont
    visibles dans l'URL de la page cible. Elles se présentent ainsi :
    http://www.site.tn/nouv_page.php?valeur=abc&txtnom=ali
    L’attribut action spécifie la page cible pour les données soumises. Cet
    attribut n'est pas obligatoire. Dans ce cas, la page en cours est re-exécutée.
    2. Récupérer les donnes d’un formulaire:
    Par défaut toutes les zones de formulaire sont automatiquement enregistrées dans
    le script PHP qui traite le formulaire (la page indiqué dans l'attribut action du
    formulaire), dans un tableau associatif:
    ‒ $_POST pour les formulaires qui utilisent la méthode POST,
    ‒ $_GET pour les formulaires qui utilisent la méthode GET.
    La clé du tableau est égale au nom de la zone dans le formulaire (option name de la
    balise: input, select, textarea,...) et la valeur égale à la valeur saisie dans la zone.

    BEN ROMDHAN Mourad 2


    ISET Nabeul ATELIER WEB DYNAMIQUE

    <form method="get" action="Traitement.php">


    Nom:<input type="text" name="txtNom" /><br/>
    Prenom:<input type="text" name="txtPrenom" /><br/>
    <input type="submit" name="btnSubmit" value="Envoyer">
    <input type="reset" name="btnReset" value="Rétablir">
    </form>

    <p><h3><b>Résultats du formulaire</b></h3></p>
    <?php
    echo "Bonjour ".$_GET["txtNom"]." ".$_GET["txtPrenom"];
    ?>
    3. Utilisation des liens hypertextes:
    L’URL peut contenir des paramètres qui permettent de passer des informations
    d’une page à une autre. url classique?nom=valeur[&…]
    Le point d’interrogation (?) introduit la liste des paramètres de l’URL séparés par le
    caractère (&); chaque paramètre est constitué par un couple nom/valeur sous la
    forme: nom=valeur:
    Exemple:
    Transmission des données:
    <?php $nom="jedidi"?>
    <?php $prenom="ali"?>
    <a href="page2.php?nom=<?php echo $nom ?>&prenom=<?php
    echo $prenom?>"> Cliquer ici </a>
    http://localhost/cours/page2.php?prenom=ali&nom=jedidi
    Récupération des données:
    echo "Nom= ".$_GET['nom']."<br/>";
    echo "Prénom= ".$_GET['prenom']."<br/>";

    Exercice 1:
    Construire une page qui permette de saisir un nom et un mot de passe. Renvoyer
    l’utilisateur sur une autre page et lui afficher si son mot de passe est correct ou non.
    (le mot de passe valide sera "mot"). Sur cette 2ème page: prévoir un bouton retour.

    BEN ROMDHAN Mourad 3


    ISET Nabeul ATELIER WEB DYNAMIQUE

    Exercice 2:
    1. Créer un formulaire comprenant un groupe de champs ayant pour titre "Adresse
    client". Le groupe doit permettre la saisie du nom, du prénom, de l’adresse, de la
    ville et du code postal. Les données sont ensuite traitées par un fichier PHP
    séparé récupérant les données et les affichant dans un tableau HTML.
    Le résultat obtenu est le suivant :

    Suissi
    Sami

    55, rue de la liberté


    Nabeul
    8100

    2. Améliorer le script précédent en vérifiant l’existence des données et en affichant


    une boîte d’alerte JavaScript si l’une des données est manquante.

    Exercice 3:
    Construire une page qui permette d’afficher :
    Une liste avec les noms des vendeurs suivants : M. Dupont, M. Louis, M. Martin
    et M. Durand (on utilisera une liste non modifiable).
    Une liste qui affiche la liste des produits disponibles (la liste des produits est
    paramétrée dans le fichier produits.php)
    Ajouter une zone de texte pour saisir le nombre de produits à commander et
    renvoyer sur une autre page le récapitulatif de la demande (ex : vous avez
    commandé 10 armoires auprès de M. Martin).

    BEN ROMDHAN Mourad 4


    ISET Nabeul ATELIER WEB DYNAMIQUE

    La page de traitement:

    Exercice 4:
    Reprendre l’exercice 3 et indiquer si la saisie n’est pas complète sur la 2ème page.
    Créer une procédure qui remplit la liste à partir d’un tableau.

    Exercice 5:
    Reprendre l’exercice 3 mais effectuer le test de saisie sur le navigateur client.

    BEN ROMDHAN Mourad 5


    ISET Nabeul ATELIER WEB DYNAMIQUE

    Exercice 6:

    BEN ROMDHAN Mourad 6

    Vous aimerez peut-être aussi