Retourner à la page d'accueil de TJS

Traiter un formulaire avec PHP

Un peu de langage serveur sur TJS

Les formulaires HTML, contrôlés par du JavaScript, sont un moyen très efficace d'envoyer des informations saisies par les utilisateurs vers le serveur. Mais comment les récupérer, les retrouver et les traiter ?

La solution est d'utiliser un langage serveur. PHP est de loin le plus accessible et le plus courant. Je vous conseille la lecture des tutoriaux "Introduction au PHP" et "Javascript et PHP".

Le langage Node.js est aussi une bonne solution.

Rappels sur les formulaires

Le moyen le plus courant pour transmettre des informations depuis le visiteur vers le serveur est d'utiliser les formulaires.

Formulaire avec quelques éléments typiques

Un formulaire est défini par la balise <form> et </form>.

Voici un exemple de formulaire :

<form name="monform" action="traiter.php" method="post" target="_blank">
  <p>Zone de texte : <input type="text" name="champtexte"></p>
  <p>Liste déroulante : 
  <select name="liste">
    <option value="1">Choix 1</option>
    <option value="2">Choix 2</option>
    <option value="3">Choix 3</option>
    <option value="4">Choix 4</option>
  </select>
  </p>
  <p>Choix multiples : 
  <input type="radio" name="niveau" value="0" checked> Débutant 
  <input type="radio" name="niveau" value="1"> Intermédiaire
  <input type="radio" name="niveau" value="2"> Bon 
  <input type="radio" name="niveau" value="3"> Jedi 
  </p>  
  <p>Cases à cocher : <input type="checkbox" name="accord" value="ok"> Je suis d'accord</p>
 <p><input type="submit" value="Envoyer"></p>
</form>

qui donne l'affichage suivant :

Emulation de la console

Un objet form a comme paramètre un nom, une action et une méthode de transmission vers le serveur.
name sert à manipuler et reconnaître l'objet form dans la page pour le traiter en JavaScript.
action contient l'adresse du script sur le serveur qui va recevoir et traiter les données du formulaire. Ici le formulaire sera envoyé à "page.php" dans le répertoire en cours.
method indique le type de transmission des données. "post" cache les données transmises au visiteur. "get" les rend visibles dans l'url de la page.
On peut aussi définir une destination par le paramètre target, équivalent au target de la balise de lien <a>.

Envoi du formulaire

L'envoi du formulaire (ou soumission ou submit en anglais) peut se faire de 2 manières.

- Soit par un clic sur un bouton de type submit :

<input type="submit" value="Envoyer">
Dans ce cas, le clic déclenche un événement onclick et formulaire est envoyé.

- Soit par du JavaScript :

document.monform.submit()

Voir le tutorial JavaScript sur les formulaires pour tous les détails sur la manipulation des formulaires.

Le traitement en PHP

Récupérer les données du formulaire

La soumission du formulaire par l'utilisateur redirige vers la page définie dans la propriété action.

Toutes données des éléments du formulaire sont transmises au serveur via l'entête HTTP. Vous pouvez d'ailleurs contrôler grâce à la console du navigateur, dans l'onglet Network ce qui est envoyé au serveur :

Exemple de rendu de la console à la soumission d'un formulaire

Accéder aux données en PHP

Les données envoyées par un formulaire de type post sont accessibles dans le tableau associatif $_POST.

Voici ce que contient $_POST par exemple :

Array
(
    [champtexte] => Voici du texte
    [liste] => 1
    [niveau] => 0
    [accord] => ok
) 

Les données envoyées par un formulaire de type get sont dans le tableau associatif $_GET.

De la même manière, dans une page PHP dont l'url est traiter.php?data=AZERTY, la valeur de data est stockée dans $_GET["data"]

La sécurité

La sécurité doit devenir l'enjeu prioritaire de tout développeur web. Bien sûr, le code doit fonctionner comme prévu dans le cas d'une utilisation normale : si un utilisateur commande un produit, le bon produit doit lui être envoyé, au bon prix et à la bonne adresse.

Mais si un utilisateur malintentionné tente de manipuler le système pour commander un produit sur le compte d'un autre utilisateur, le code doit l'empêcher.

Ainsi, il est indispensable de contrôler les saisies du formulaire, du côté du serveur de manière à vérifier que les données envoyées sont bien du type attendu.

Le contrôle de formulaire côté JavaScript doit être réalisé dans un esprit d'assistance à l'utilisateur pour lui faciliter l'utilisation du formulaire. Le contrôle côté serveur doit être réalisé pour valider les données envoyées et interdire toute utilisation illicite.

Les actions possibles

Le PHP peut faire une multitudes de traitements sur les données.
- Sauvegarder dans un fichier ou dans une base de données
- Envoyer par mail
- Réaliser un calcul et retourner un résultat

Tutoriel écrit par webmaster mis à jour le

Chercher une fonction, un objet, ...

Le 18/09/2018 21:30:38 sur php7 en 12.88 ms