+++ /dev/null
-<?xml version="1.0" encoding="utf-8" ?>
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
- >
-<html xmlns="http://www.w3.org/1999/xhtml" >
- <head>
- <title>Formulaires</title>
-
- <meta http-equiv="Content-Type"
- content="text/html; charset=utf-8" />
- <meta name="copyright"
- content="Copyright © 2013 Kim Nguyễn" />
-
- <!-- Load jQuery -->
- <script src="../jquery-2.0.3.min.js" type="text/javascript" ></script>
- <script src="../libs/raphael-min.js" type="text/javascript" ></script>
- <!-- Load the library -->
- <script src="../simpleWebSlides.js" type="text/javascript" ></script>
-
- <link rel="stylesheet" href="../simpleWebSlides.css" type="text/css" media="all" />
- <!-- Load a custom Theme, the class-element marks this style-sheet
- a "theme" that can be swtiched dynamicaly -->
- <link class="sws-theme" rel="stylesheet" title="U-Psud style" href="../themes/uPsud.css" type="text/css" />
-
- <!-- Customize some templates and initialize -->
-
- <script type="text/javascript">
- SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeFadeOutIn;
- SWS.Config['sws-object-deactivate'] = SWS.Effects.objectDeactivateFadeOut;
- SWS.Config['sws-object-activate'] = SWS.Effects.objectActivateFadeIn;
-
- //Ensures that we load SWS at the very end, after MathJax has
- //been initialized
-
- $(window).load(SWS.Presentation.init);
- </script>
- </head>
- <body>
- <a href="unix_prog_web_07.xhtml" class="sws-previous"/>
- <div class="sws-slide sws-cover sws-option-nofooter">
- <h1>Unix et Programmation Web</h1>
- <h1>Cours 8</h1>
- <a href="mailto:kn@lri.fr">kn@lri.fr</a><br/>
- <a href="http://www.lri.fr/~kn/">http://www.lri.fr/~kn</a>
- </div>
-
- <h1>Formulaires (utilisation avancée)</h1>
- <div class="sws-slide">
- <h1>Champs de texte</h1>
- <p>On peut placer un champ de texte dans un formulaire au moyen
- de la balise <em><tt><input type="text"
- /></tt></em>.
- </p>
- <code><![CDATA[ <input size="10" name="montexte" type="text" value="abc" />]]></code>
- <p>Apperçu: <input size="10" name="montexte" type="text"
- value="abc"/><br/><br/>
- Attributs:
- </p>
- <ul>
- <li>size: donne la largeur en caractères</li>
- <li>name: le nom de l'élément (pour y accéder depuis PHP)</li>
- <li>value: la valeur initiale du champ (si on veut le pré-remplir)</li>
- </ul>
- <p>Accès à la valeur depuis PHP se fait
- via <tt>$_GET["montexte"]</tt> ou <tt>$_POST["montexte"]</tt>
- selon la valeur de l'attribut <tt>method</tt> de
- l'élément <tt>form</tt> englobant.</p>
-
- </div>
-
- <div class="sws-slide">
- <h1>Champs de texte long</h1>
- <p>Pour des textes multilignes, on utilise la
- balise <em><tt><textarea /></tt></em>.
- </p>
- <code><![CDATA[ <textarea name="montexte" rows="3" cols="10">du texte!</textarea>
-]]></code>
- <p>Apperçu: <textarea name="montexte" rows="3" cols="10">du texte!</textarea>
- Attributs:
- </p>
- <ul>
- <li>rows: donne le nombre de lignes</li>
- <li>cols: donne le nombre de colonnes (largeur en nombre de caractères)</li>
- <li>name: le nom de l'élément (pour y accéder depuis PHP)</li>
- </ul>
- <p>On peut pré-remplir la zone en mettant du texte entre la
- balise ouvrante et fermante.
- Accès à la valeur depuis PHP se fait
- via <tt>$_GET["montexte"]</tt> ou <tt>$_POST["montexte"]</tt>
- selon la valeur de l'attribut <tt>method</tt> de
- l'élément <tt>form</tt> englobant.</p>
- </div>
- <div class="sws-slide">
- <h1>Listes déroulantes</h1>
- <p>On peut définir une liste déroulante avec les
- balises <tt><select></tt> et <tt><option></tt></p>
-<code><![CDATA[
- <select name="maliste">
- <option value="bleu" >Bleu</option>
- <option value="vert" >Vert</option>
- <option value="rouge" >Rouge</option>
- <option value="jaune" selected="selected" >Jaune</option>
- </select>
-]]></code>
-<p> Apperçu: <select name="maliste">
- <option value="bleu" >Bleu</option>
- <option value="vert" >Vert</option>
- <option value="rouge" >Rouge</option>
- <option value="jaune" selected="selected" >Jaune</option>
- </select>
- Attributs:
- </p>
- <ul>
- <li>name (dans select): le nom de l'élément (pour y accéder
- depuis PHP)</li>
- <li>value (dans option): donne la valeur du choix</li>
- <li>checked (dans option): pré-selectionne cette option</li>
- </ul>
- <p>Le contenu de chaque élément option est celui affiché dans la
- liste.
- Accès à la valeur depuis PHP se fait
- via <tt>$_GET["maliste"]</tt> ou <tt>$_POST["maliste"]</tt>
- selon la valeur de l'attribut <tt>method</tt> de
- l'élément <tt>form</tt> englobant.</p>
- </div>
- <div class="sws-slide">
- <h1>Boutons à choix unique</h1>
- <p>On peut définir un choix avec la balise
- <tt><input type="radio"></tt></p>
-<code><![CDATA[
- 8h<input type="radio" name="h" value="matin"/>
- 12h<input type="radio" name="h" value="midi"/>
- 20h<input type="radio" name="h" value="soir"/>
-]]>
-</code>
-<p>Apperçu : 8h<input type="radio" name="h" value="matin"/>
-12h<input type="radio" name="h" value="midi"/>
-20h<input type="radio" name="h" value="soir"/>
-</p>
- <p>
- Accès à la valeur depuis PHP se fait
- via <tt>$_GET["h"]</tt> ou <tt>$_POST["h"]</tt>
- selon la valeur de l'attribut <tt>method</tt> de
- l'élément <tt>form</tt> englobant.<br/>
- <s>Attention</s> il faut réutiliser la même valeur de
- l'attribut <tt>name</tt> pour les boutons du même groupe.
-
-</p>
-</div>
- <div class="sws-slide">
- <h1>Cases à choix multiples</h1>
- <p>On peut définir des cases à cocher à choix multiple avec la balise
- <tt><input type="radio"></tt></p>
-<code><![CDATA[
- 8h<input type="checkbox" name="tab[]" value="matin"/>
- 12h<input type="checkbox" name="tab[]" value="midi"/>
- 20h<input type="checkbox" name="tab[]" value="soir"/>
-]]>
-</code>
-<p>Apperçu:
- 8h<input type="checkbox" name="tab[]" value="matin"/>
- 12h<input type="checkbox" name="tab[]" value="midi"/>
- 20h<input type="checkbox" name="tab[]" value="soir"/>
-</p>
- <p>
- Accès à la valeur depuis PHP se fait
- via <tt>$_GET["tab"]</tt> ou <tt>$_POST["tab"]</tt>
- selon la valeur de l'attribut <tt>method</tt> de
- l'élément <tt>form</tt> englobant.<br/>
- <s>Attention</s> il faut rajouter <tt>[]</tt> dans l'attribut <tt>name</tt> pour
- que PHP crée un tableau. <tt>tab[<i>i</i>]</tt> contient la
- valeur de la <i>i<sup>ème</sup></i> cases cochée (à partir de 0).
-
-</p>
-</div>
-<h1>Variables super-globales (rappels)</h1>
-<div class="sws-slide">
- <h1>Variables super-globales</h1>
- <p>PHP définit un certain nombre de variables dites
- « super-globales ». Ce sont des variables accessible
- depuis n'importe où dans un programme PHP, y compris depuis des
- fonctions, sans adjonction du mot clé <tt>global</tt>.</p>
- <code>
- $TOTO = 42;
- function f() {
- global $TOTO; // obligatoire, sinon $TOTO n'est pas visible
-
- echo $TOTO;
- echo $_GET["champ"]; //fonctionne toujours, même sans 'global'
- //au début de la fonction.
-
- }
-
- </code>
-</div>
-<div class="sws-slide">
-<h1>Variable <tt>$_GET</tt> et <tt>$_POST</tt></h1>
-<p>
- Ces variables contiennent les valeurs des champs d'un formulaire.
- Si l'attribut <tt>method</tt> de l'élément <tt>form</tt>
- vaut <tt>get</tt> la variable <tt>$_GET</tt> contient les valeurs.
- S'il vaut <tt>post</tt> la variable <tt>$_POST</tt> est à utiliser.
-</p>
-</div>
-<div class="sws-slide">
-<h1>Variable <tt>$_FILES</tt></h1>
-<p>
- Cette variable contient les informations relatives aux fichiers
- envoyés par le client.<br/>Si le nom du champ est <tt>fichier</tt>,
- alors:
-
-</p>
-<dl>
- <dt><tt>$_FILES["fichier"]["error"]</tt></dt> <dd>Code d'erreur
- (0 si tout c'est bien passé, <tt>></tt> 0 si une erreur s'est produite. Les
- autres champs ne sont définis que si "error" vaut 0).
- </dd>
- <dt><tt>$_FILES["fichier"]["tmp_name"]</tt></dt><dd>Nom du fichier
- temporaire sur le serveur où a été sauvegardé le contenu du
- fichier envoyé</dd>
- <dt><tt>$_FILES["fichier"]["name"]</tt></dt><dd>Nom original du fichier</dd>
- <dt><tt>$_FILES["fichier"]["size"]</tt></dt><dd>Taille du
- fichier</dd>
- <dt><tt>$_FILES["fichier"]["type"]</tt></dt><dd>Le type MIME du fichier</dd>
- </dl>
-</div>
-<div class="sws-slide">
-<h1>Variable <tt>$_SESSION</tt></h1>
-<p>Contient les <em>variables de sessions</em>. La variable n'est
- accessible qu'après un appel à <tt>session_start()</tt>. Ces
- le contenu de cette variable persiste durant toute la durée de la
- session même sur des pages différentes. La
- variable <tt>$_SESSION</tt> est un tableau.
-</p>
-</div>
-
-<div class="sws-slide">
-<h1>Variable <tt>$_COOKIE</tt></h1>
-<p>Contient les <em>cookies</em> que le client à envoyé au serveur.
- La
- variable <tt>$_COOKIE</tt> est un tableau.
-</p>
-</div>
-<h1>Conception d'une application simple (étude de cas)</h1>
-<div class="sws-slide">
- <h1>Cahier des charges</h1>
- <p>On souhaite créer une application Web simple de gestion de QCM.
- L'application doit répondre au contraintes suivantes :
- </p>
- <ul>
- <li>Un QCM est un ensemble de questions, suivies d'une liste de
- choix. Il peut y avoir plusieurs choix possible. La réponse à la
- question est correcte si uniquement les bons choix sont
- sélectionnés.</li>
- <li>Un QCM doit être facilement modifiable/éditable</li>
- <li>Après la réponse à la dernière question, le score de
- l'utilisateur est affiché, ainsi que les bonnes réponses</li>
- <li>Il y a un temps limite par question</li>
- </ul>
-</div>
-<div class="sws-slide">
-<h1>But du jeu</h1>
-<p>Nous allons concevoir, le plus précisément possible l'application
- (prenez des notes) :
-</p>
-
- <ul>
- <li>Rafiner le cahier des charges</li>
- <li>Prévoir plusieurs scénarios d'utilisation</li>
- <li>Concevoir l'application (données, interface grapique,
- code)</li>
- <li>Tester/vérifier la robustesse</li>
- </ul>
-<p>Vous devrez écrire le code correspondant en TP</p>
-</div>
- </body>
-
-
-
-</html>
projects / hacks / simpleWebSlides.git / blobdiff