Apprendre PHP (5/19) - Traitement de formulaires en PHP

Bonjour à tous et bienvenue dans cette nouvelle leçon de PHP. Après avoir vu les bases du langage, comme les variables et les structures de contrôle, il est temps de passer aux choses sérieuses et aujourd'hui, nous allons voir comment manipuler les formulaires en PHP. Alors j'ai déjà préparé le code HTML suivant. Il contient un formulaire d'inscription qui permet aux utilisateurs de s'inscrire en fournissant quelques informations personnelles comme par exemple le nom, le prénom et l'âge. Bien sûr, ce n'est pas une vraie inscription proprement dite parce qu'il manque des informations cruciales comme le login, mot de passe, etc. Mais pour le moment, il s'agit simplement d'un exemple qui permet de voir comment manipuler les formulaires en PHP. Alors j'ai intégré 3 champs input. Donc le premier, c'est le nom, donc c'est input type text. Le deuxième, c'est aussi un texte qui va représenter le prénom. Et le dernier, c'est un type number qui représente l'âge. Bien sûr, j'ai fixé le minimum à 12 ans pour dire que seulement les personnes qui sont âgées d'au moins 12 ans sont autorisées à s'inscrire sur ce site web. Et finalement, il y a un bouton de type submit qui permet de soumettre le formulaire au serveur afin de le traiter. Bien entendu, j'ai intégré un petit style CSS qui permet de formater un petit peu le contenu et casser le rendu par défaut. À la fin, ce que nous avons sur le navigateur, c'est le résultat suivant. Donc nous avons le formulaire qui contient 3 champs: le nom, le prénom et l'âge, avec le bouton Submit. L'objectif maintenant, c'est de récupérer tout d'abord les valeurs saisies par l'utilisateur. Pour ce faire, on va se rendre dans la page PHP et ici nous allons intégrer notre code PHP. Et comme je l'ai dit à une séance précédente, vous pouvez intégrer votre script PHP là où vous voulez. Ça veut dire qu'il n'y a aucune restriction. Vous pouvez l'intégrer avant le DOCTYPE ou bien n'importe où. Ça veut dire même à l'intérieur d'une balise, on peut toujours intégrer le PHP puisqu'il est exécuté en premier sur le serveur avant de renvoyer le résultat au client. Alors ce que nous allons faire maintenant, c'est quoi? C'est tout d'abord choisir l'emplacement où l'on va intégrer notre PHP. Bien sûr, un emplacement qui est adapté à nos besoins. Bon, tout dépend de là où vous voulez afficher les messages, parce que comme je l'ai dit, l'objectif c'est que l'utilisateur oubliera par exemple de saisir le nom et quand il clique sur m'inscrire, on va afficher un message d'erreur. Est-ce que vous souhaitez l'afficher en haut, bien en bas, ou bien sur le côté? Bon, ça dépend. Donc maintenant, on va dire dans un premier temps que l'on veut afficher le message en bas. Alors on a tendance à croire que les scripts qui vont faire le traitement seront placés en bas également. Mais ce n'est pas une bonne idée. Ce qu'on va faire, c'est quoi? C'est qu'on va séparer notre code PHP en 2 parties. La première partie, c'est celle qui permet de faire le traitement pour voir un petit peu la validité des champs. Et il est préférable de faire cette partie tout en haut du document, ça veut dire avant même le DOCTYPE. Et cette zone, elle sera consacrée juste à l'affichage des messages que l'on souhaite. Alors comment on va faire? On va se rendre carrément au début du document. Bien sûr, ce choix est justifié, mais bon, ce n'est pas le moment de parler de ça en détail parce qu'on va voir ensuite quels fonctions spéciales, ce qu'on appelle des fonctions qui renvoient des en-têtes HTTP. Et ces fonctions-là nécessitent d'être exécutées en premier, ça veut dire avant même de renvoyer aucun contenu au navigateur. Alors pour le moment, on va accepter le fait qu'il faut toujours déclarer ses scripts les plus importants au début de la page de cette manière. Voilà, comme ça PHP. Et maintenant, première chose à faire, c'est que je vais récupérer la valeur saisie par l'utilisateur dans le champ qui s'appelle nom. En PHP, on met la syntaxe suivante: $_POST en majuscule et entre des crochets on va mettre le nom du champ. Dans ce cas c'est nom. Alors ce que je viens de créer, ça s'appelle une variable superglobale. Cette variable superglobale, elle est accessible dans tous les contextes. Ça veut dire qu'elle est accessible à l'intérieur des fonctions, à l'extérieur des fonctions, voire même à l'intérieur des classes. Ça veut dire que vous pouvez accéder à cette variable de n'importe quel emplacement dans votre code PHP, il sera toujours accessible. Première chose, vous avez constaté la présence des crochets. En réalité, il s'agit d'une variable de type tableau et on dit que c'est un tableau associatif parce qu'entre les crochets on n'a pas mis un indice numérique mais une chaîne de caractères en guise de clé. On verra bien sûr ça en détail dans la partie consacrée aux tableaux, mais pour le moment sachez que $_POST c'est une variable superglobale qui permet d'envoyer aux scripts PHP les informations qui sont envoyées via la méthode POST POST. Dans ce cas, le POST que j'ai ici, il est justifié par la méthode utilisée dans le formulaire, c'est la méthode POST. Autrement dit, imaginez que j'ai utilisé la méthode GET. Dans ce cas, ce qu'il faut mettre, c'est GET. Alors c'est la même chose, mais bien sûr la méthode POST est généralement privilégiée à la méthode GET. Et ici, bien sûr, entre les crochets, on mettra tout simplement l'attribut name du champ concerné. Alors là, la variable $postNom représente la valeur qui est saisie dans le champ qui s'appelle nom dans ce cas. D'accord, donc maintenant pour manipuler cette variable, vous avez constaté que c'est un peu long. Bon, ça contient un peu des crochets, le sous-tiré, des doubles quotes, etc. Alors on va l'affecter à une variable scalaire. Cette variable, je vais l'appeler nom tout simplement pour ne pas avoir de confusion par la suite. Bon, dans ce cas, $nom correspond au champ nom, $prénom correspond au champ prénom, etc. D'accord, donc maintenant première chose à faire, c'est qu'on va exécuter ce script pour voir un petit peu le résultat. Alors j'exécute ma page et vous avez constaté qu'au début j'ai un message. En fait c'est un message d'erreur qui s'affiche: undefined index nom. Ça me dit que dans cet index-là le nom n'est pas reconnu à la ligne 2. Ça me donne même la ligne qui contient l'erreur. Mais si on constate bien, on voit que l'erreur est préfixée par le mot notice. Bon, ça veut dire c'est une notification. En réalité en PHP il existe de nombreux types d'erreurs. Il y a les E STRICT, E WARNING, etc. C'est-à-dire qu'elles reflètent en quelque sorte le niveau de gravité de l'erreur. Dans ce cas, c'est juste une notification, ce n'est pas une erreur qui va carrément bloquer le script. D'ailleurs, vous avez constaté que le HTML est affiché correctement. Mais si c'était une erreur plus grave que le serveur ne peut pas ignorer, alors dans ce cas, même le code HTML ne serait pas exécuté. Par exemple, imaginez que j'ai oublié les doubles quotes qui sont là. Donc là, c'est carrément une erreur de syntaxe. Alors quand j'actualise la page, et voilà, ça me donne parse error. Ça veut dire que c'est une erreur qui est grave, que le serveur ne peut pas ignorer. Bon, ça veut dire il peut pas exécuter ce qui vient après. Alors il faut résoudre ce problème avant de poursuivre l'exécution. Maintenant on va remettre le code tel qu'il était. Quand j'exécute maintenant, on voit bien que l'erreur elle est toujours présente mais le script s'exécute quand même. Bien entendu on aura l'occasion de parler des erreurs au fur et à mesure qu'on progresse dans le cours dans des futures vidéos. Pour le moment il faut savoir que cette erreur n'empêche pas l'exécution du code et pourtant elle gêne un petit peu l'affichage parce qu'on constate bien que dans la page il y a la présence de quelque chose d'anormal. Ce message ne devrait pas être affiché. Alors si ce message vous gêne tellement, il suffit de le masquer. Pour le masquer, il y a plusieurs manières de le faire. Nous, bien sûr, on va aller étape par étape parce que par la suite, comme j'ai dit, on va voir un petit peu comment gérer la configuration du serveur et comment assurer la gestion des erreurs et tout le reste. Mais bon, vous vous rappelez un petit peu de la fonction phpinfo qu'on a vue dans la première vidéo? Alors on va l'exécuter, on va mettre phpinfo Et cette ligne, je vais carrément la commenter, bon, pour éviter que l'erreur s'affiche. Maintenant j'actualise, j'ai le phpinfo ici et je vais chercher le fichier de configuration des moteurs PHP qui s'appelle php.ini. Donc maintenant je vais copier cette ligne et je vais l'ouvrir dans un éditeur de texte. Donc moi je vais utiliser la ligne de commande, donc vim, et je mets le chemin. Donc ça me donne ce contenu. En fait, il s'agit bien du fichier php.ini. Bon, je vais chercher la ligne DisplayErrors. DisplayErrors est une directive qui indique au serveur est-ce qu'il doit afficher les erreurs ou non. Dans ce cas, on voit bien que DisplayErrors contient la valeur on, ça veut dire j'autorise l'affichage des erreurs. Il y a aussi ErrorReporting, et dans ce cas vous spécifiez la nature des erreurs à afficher. Ici donc il y a all, ça veut dire tous les types d'erreurs, à savoir les erreurs strictes ou bien les erreurs de notification, etc. Bon, pour le moment il faut savoir que tant que vous êtes en phase de développement, ça veut dire vous travaillez avec une plateforme de développement, il faut faire tous les tests nécessaires avant de déployer votre projet sur un vrai serveur de production. C'est pourquoi il faut essayer d'afficher la moindre erreur même s'il est insignifiant. Alors mon conseil, c'est qu'il faut toujours que cette directive display-errors ait la valeur on et aussi error-reporting ait la valeur all. Dans ce cas, on est sûr que toutes les erreurs éventuelles seront affichées sur mon navigateur en phase de test. Et bien entendu, quand vous hébergerez votre site sur un vrai serveur d'applications, dans ce cas il n'est pas recommandé du tout d'afficher les erreurs pour des raisons de sécurité. Alors là, donc on va désactiver l'affichage des erreurs et on peut même personnaliser donc le type d'erreur à logger. Bon, parce que les erreurs, même s'ils sont pas affichés, ils seront journalisés dans un fichier de log. Bon, juste une remarque pour les gens qui utilisent les serveurs LAMP ou bien MAMP, il est possible que cette directive display_errors ait par défaut la valeur off. Alors il est préférable de la modifier en on afin de pouvoir afficher toutes les erreurs sur son navigateur. Maintenant qu'on a vu ça, bon, je vais quitter ceci. Maintenant on va se rendre dans notre code et on va remettre le code tel qu'il a été. OK, donc maintenant j'ai dit qu'au chargement de la page il y a cette erreur qui s'affiche. Mais regardez ce qui se passe quand je vais cliquer sur le bouton submit. L'erreur disparaît, c'est normal parce que maintenant le message, qu'est-ce qu'il me disait? Il me disait que cet index n'est pas défini et c'est vrai. Parce que le formulaire n'est pas encore envoyé au serveur. Mais quand il est envoyé, c'est bon. Maintenant le moteur PHP reconnaît bel et bien cet index et du coup il est conscient de la présence de la variable nom. Alors il n'y a plus d'erreur à ce stade. Pour nous, ce qu'on va faire, c'est que puisque cette erreur nous gêne un petit peu, on va la masquer provisoirement. Pour la masquer, il suffit de préfixer cette instruction par le caractère@. Dans ce cas, le caractère@ va tout simplement masquer les messages d'erreur qui seront éventuellement affichés suite à l'exécution de cette instruction. Maintenant quand j'exécute la première fois, donc j'ai plus d'erreur et quand je clique, j'ai plus d'erreur non plus. Ça veut dire que l'erreur est toujours là, bon c'est une erreur qui n'est pas si grave, mais je l'ai masquée. Alors maintenant je vais faire le même traitement pour les autres champs, à savoir le prénom dont la variable correspondante s'appelle prénom également, et aussi âge qui est là, avec la variable âge. Alors maintenant j'ai récupéré mes 3 variables. Ce que je dois faire maintenant, c'est afficher le message d'erreur si un des champs est laissé vide. Bon, bien sûr, on va pas vérifier si le nom et le prénom contiennent que des caractères alphabétiques, etc., parce qu'on n'a pas encore vu les chaînes de caractères, les expressions régulières, les filtres, etc. Bon, maintenant on va se contenter de voir est-ce que le champ est laissé vide ou non, peu importe la nature d'information qu'il contient. Maintenant quand je clique sur le bouton, il faut afficher le message. Bon, je vais dire que je vais afficher le message en bas. Ce que je vais faire maintenant c'est un test avec la structure if. Donc if et j'utilise la fonction empty. La fonction empty en PHP permet de vérifier si l'argument qui lui est passé, dans ce cas on va mettre la variable nom, si cet argument est vide ou non. C'est-à-dire si la valeur qui est affectée à cette variable, qui n'est rien d'autre que la valeur saisie par l'utilisateur dans le champ nom, s'il est vide ou non. S'il est vide, alors empty retourne true, sinon il retourne false. Dans ce cas, donc si le champ est vide, on va faire un truc du genre, par exemple, echo nom laissé vide. On va juste afficher le message de cette manière, de manière brute. Bien sûr, il sera affiché au haut du navigateur. Maintenant, j'exécute la page la première fois. Alors regardez bien que ça m'affiche nom laissé vide avant même de cliquer sur le bouton submit. Et là, c'est pas une très bonne chose parce qu'il ne faut afficher les messages d'erreur que si l'utilisateur aura cliqué sur le bouton Submit. Alors, ce qui n'est pas le cas. Bon, maintenant si je clique, le message est toujours là, mais au premier chargement de la page, carrément, le message est toujours présent. Ce que je vais faire maintenant, c'est que je vais vérifier est-ce que l'utilisateur a cliqué sur ce bouton. Et regardez bien que le bouton lui aussi, il a un nom qui s'appelle valider. Alors, et là encore, je vais le récupérer. De cette manière, donc valider. Et le bouton, je vais l'appeler valider aussi. Bon, n'oublie pas l'arobase parce que lui aussi peut afficher un message d'erreur. Maintenant, avant de faire ce traitement, je vais d'abord vérifier est-ce que l'utilisateur a cliqué sur le bouton. Ça veut dire est-ce que la variable valider existe. Quand est-ce qu'elle sera existante? C'est quand le formulaire sera posté au serveur. Donc je vais mettre if isset validé. La fonction isset permet de vérifier est-ce que cette variable existe ou non. Alors empty, il permet de vérifier si la variable est vide ou non, alors que isset, il vérifie si la variable existe ou non. Dans ce cas, si la variable validé existe, isset retourne true, sinon il retourne false. Et quand est-ce que cette variable existera-t-elle? C'est quand l'utilisateur aura cliqué sur le bouton submit. Ça veut dire quand le formulaire sera posté serveur. Faisons le test maintenant pour voir. Il se passe rien. Maintenant quand je clique sur le bouton et que j'ai laissé le champ vide, j'ai un message. Maintenant quand j'écris quoi que ce soit, le message disparaît. Ça veut dire que mon test est bon. Il y a juste un problème, c'est qu'il faut pas afficher le message en haut. Moi je veux l'afficher en bas, ça veut dire ici après carrément le bouton m'inscrire. Donc qu'est-ce que je vais faire? Je vais prévoir une zone, par exemple après la section, bien juste après le formulaire. Voilà, je vais mettre par exemple une div comme ça et dedans je vais afficher l'erreur. Alors je vais écrire un script PHP de cette manière, donc PHP echo et je vais prévoir une variable qui s'appelle erreur. Ça veut dire que cette variable sera affichée en bas, ça veut dire en bas du formulaire carrément. Mais cette variable n'existe pas encore. Alors maintenant ce que je vais faire ici, c'est qu'au lieu d'afficher directement le message, je vais l'affecter à la variable erreur comme ça. Erreur égale. Maintenant regardez ce qui va se passer. Donc quand j'exécute la première fois, j'ai encore un message undefined variable erreur. Ça veut dire que cette variable n'est pas définie et c'est normal parce qu'à la première exécution erreur n'existait même pas avant de cliquer sur le bouton. Alors dans ce cas j'essaie d'afficher quelque chose qui n'existe pas, c'est une erreur. Il suffit de mettre l'arobase pour masquer l'erreur, sinon je peux carrément initialiser la variable erreur avec une chaîne vide de cette manière. Dans ce cas, la variable existe mais elle est vide. Et un message lui sera affecté suite à la présence d'une erreur. Maintenant j'exécute. La première fois, j'ai rien. Et quand je clique, j'ai bien le message n'en laissez vide. Bon, si je veux colorer ce message en rouge, j'ai déjà prévu un style CSS. Voilà donc un identifiant erreur avec la couleur rouge. Alors il suffit d'appliquer cet identifiant à la div. Je mettrai ici id erreur, voilà, comme ceci. Donc maintenant j'exécute et voilà, donc j'ai la div qui est colorée en rouge. Donc quand je clique, donc maintenant il y a le message qui est inscrit dedans. Mais vous avez remarqué que même si j'ai pas encore cliqué sur le bouton, la div est présente. C'est normal. Alors il faut mettre une condition sur cette div, ça veut dire qu'elle ne sera présente que si une erreur est survenue. Alors je vais mettre ici une condition PHP. Bon, figurez-vous bien que la variable $erreur dans un premier temps est vide. Alors il suffit de vérifier si cette variable n'est pas vide pour que je puisse afficher cette div. Donc je mettrai ici une condition PHP. En petit erreur. Bon, plutôt je vais mettre if not, bon, c'est-à-dire si ce n'est pas vide, et je mettrai ici l'accolade. Alors là, donc j'ai fait une condition sur un traitement HTML, on a déjà vu ça la séance précédente. Bon, maintenant j'exécute pour voir le résultat. Première exécution, j'ai rien, et quand je clique, c'est uniquement à ce moment-là que j'ai le message d'erreur qui est affiché. Bon, je peux formater ce message un petit peu. Au lieu de mettre juste une chaîne comme ça, je vais mettre par exemple la balise li. Voilà, donc maintenant je clique, voilà, ça m'affiche ça. Bon, si je mets n'importe quoi dans la zone, dans ce cas j'ai pas de message d'erreur, sinon il y a un message qui s'affiche. Maintenant je vais faire le même traitement pour les autres champs. Maintenant ça dépend de ce que vous voulez. Est-ce que vous voulez afficher les erreurs une à une ou bien les afficher toutes d'un seul coup? Si vous voulez les afficher une à une, il suffit de mettre ici else if. On mettra encore de test, un petit prénom. Et là donc le message sera prénom laissé vide. Alors on exécute. Donc maintenant si je mets rien, j'ai juste le nom laissé vide. Si j'écris quelque chose, j'ai maintenant prénom laissé vide. Et si vous voulez afficher que des messages d'un seul coup, alors pas la peine de mettre else if, je mettrai juste if. Voilà, et dans ce cas à erreur, je vais concaténer le message suivant. Ça veut dire que j'ai l'erreur qui contient le message nom laissé vide avant, maintenant je vais lui ajouter le prénom laissé vide. Maintenant quand j'exécute, je clique, j'ai les deux messages qui sont affichés d'un seul coup. Bon, si je remplis l'un des champs, alors je n'aurai qu'un seul message. Voilà, bon, on va faire la même chose pour l'âge. Age comme ça. Même chose, on va mettre par exemple age, age invalide. Là, j'ai uniquement vérifié si l'âge est laissé vide, mais je peux utiliser une fonction isNumérique comme ça. IsNumérique, plutôt je vais mettre not isNumérique. Ça veut dire si l'âge n'est pas numérique. Bon, ça veut dire si c'est une valeur qui n'est pas numérique, dans ce cas, bon, je vais afficher l'erreur. Bien sûr, j'ai utilisé un champ number, alors je peux pas écrire quelque chose qui n'est pas numérique. Il y a que des nombres. Mais n'oubliez pas que c'est du HTML, c'est-à-dire c'est du côté client. D'ailleurs, si vous avez fait attention, j'ai bien spécifié ici le min c'est 12, mais rien ne m'empêche d'entrer une valeur qui est inférieure à 12 et le PHP l'acceptera quand même. Autrement dit, regardez ce que je vais faire. Par exemple, je vais mettre ici if not is numeric or, bon ça veut dire ou bien, age est inférieur à 12. Bon, ça veut dire si le champ n'est pas numérique ou bien il est inférieur à 12, alors dans ce cas j'aurai âge invalide. Avec ça, bien sûr, je peux rien faire puisque j'ai spécifié le champ number avec un minimum de 12, alors la condition sera toujours vraie. Alors j'aurai jamais de message concernant l'âge que si je laisse celui-ci vide. Dans ce cas, j'aurai âge invalide. Mais n'oubliez pas que c'est du HTML, c'est-à-dire je peux faire un truc du genre, je vais mettre par exemple inspecter. Voilà, donc là j'ai le code HTML, je peux modifier, je peux mettre par exemple, donc le minimum c'est 1, donc alors là bon je peux mettre la valeur 1 et quand je vais m'inscrire j'ai toujours le message d'erreur âge invalide et c'est normal parce que j'ai prévu ce message avec du PHP. Si j'avais pas mis ce traitement Alors dans ce cas, je peux entrer la valeur 1. Ouais, donc le navigateur m'autorise à entrer la valeur même si dans le code source moi j'ai pas autorisé. Et voilà, donc j'ai pas de message d'erreur. Alors c'est pourquoi tout ce qui est contrôle de saisie, il faut toujours le faire avec un langage côté serveur. C'est-à-dire que même JavaScript n'est pas approprié à ce genre de traitement parce que ça reste aussi un langage côté client. Du coup, il est accessible à travers la console et je peux le modifier comme je souhaite. Et du coup, je peux passer des informations qui sont fausses. D'accord, continuons. Il nous reste maintenant une dernière chose à faire. Bon, je vais d'abord remettre de côté le qu'il était. Alors maintenant les tests sont bons. Imaginez que j'ai rempli par exemple la valeur nom, la valeur prénom et l'âge je l'ai oublié. Dans ce cas j'ai un message d'erreur qui s'affiche qui concerne juste l'âge. Mais les champs nom et prénom ils ont été vidés. Pour conserver ces champs c'est simple. On va utiliser l'attribut value et dedans on va mettre un texte par défaut. Le texte par défaut dans ce cas ne serait rien d'autre que la valeur du nom. Qui sera reçu en PHP. On le mettra quelque chose comme ça. Bon, même chose pour le prénom et aussi pour l'âge. Donc maintenant, imaginez que j'ai écrit par exemple quelque chose, bon, ABCDEF. Voilà, on constate bien que le navigateur, il conserve ces valeurs. Et j'ai juste l'erreur qui est affichée qui concerne l'âge. Bon, maintenant je vais mettre une valeur comme ça. Et voilà, donc je n'ai plus aucune erreur et les champs sont conservés. Donc voilà, c'était un exemple simple de contrôle de saisie dans un formulaire. Et le plus important, c'est qu'on a appris comment manipuler un formulaire, qu'on utilise POST ou bien GET. On se contente de ça pour cette séance. Merci pour votre attention et à la vidéo prochaine.