Les formulaires et la transmission des données en PHP

Transcription

Les formulaires et la transmission des données en PHP
Les formulaires et la transmission des données en PHP
Dans la partie "formulaire" du langage HTML, nous avons vu comment créer un formulaire avec le langage HTML. Pour ce
cours, nous allons créer un exemple de système de news :
Nous allons créer un formulaire composé de deux zone de texte (une zone de texte pour le pseudo, une zone de texte
pour le titre de la news).
● Ensuite, nous allons créer un texterea dans lequel, nous mettrons une actualité. Cette page sera nommée news.php.
● Ensuite, nous devons ajouter une page que l'on nommera ajout.php. Cette page servira à envoyer les données saisies
dans une base de données.
● Ensuite, les news s’afficheront grâce à une page liste de news nommée liste_news.php.
● La page où sera affiché la news s’appellera affichage_news.php.
● Nous allons aussi créer une page en css qui permettra de mettre en page notre formulaire de news ainsi que la liste des
news.
● N’oubliez pas aussi qu’il faut créer une table news dans notre base de données nommée « toto »
●
La page en css (style.css)
/* Creation du formulaire de news */
.news {
width:100%;
}
.titre_actu {
font-family:Arial, Tahoma;
text-align:center;
font-size:2em;
}
.titre_zone_texte {
float:left;
width:30%;
height:20px;
font-family:Arial, Tahoma;
}
.zone_texte {
float:right;
width:70%;
font-family:Arial, Tahoma;
font-size:1em;
}
.bouton {
width:100%;
text-align:center;
}
/* Affichage toutes les news */
.toutes_news {
width:100%;
}
.pseudo_toutes_news {
float:left;
width:30%;
}
.titre_toutes_news {
float:right;
width:70%;
}
Ici, je ne vous explique rien. C’est du langage CSS très facile. Reprenez le cours sur le CSS si vous ne le comprenez pas
Le formulaire de news (news.php) :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Formulaire de création de news</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="titre_actu">Ecrire une actualité pour mon site</div>
<form method="post" action="ajout.php">
<div class="news">
<div class="titre_zone_texte">Pseudo :</div>
<div class="zone_texte"><input type="text" name="pseudo" size="50" maxlength="50"></div>
<div class="titre_zone_texte">Titre de la news :</div>
<div class="zone_texte"><input type="text" name="titre" size="100" maxlength="255"></div>
<div class="titre_zone_texte">News :</div>
<div class="zone_texte"><textarea name="news" rows="10" cols="60"></textarea></div>
</div>
<div class="bouton"><input type="submit" value="Valider"></div>
</form>
</body>
</html>
Ce code HTML permet l’affichage d’un formulaire permettant la saisie d’un pseudo, d’un titre et d’une actualité. Regardez bien
l’action de ce formulaire. L’action de ce formulaire va se faire grâce à un fichier nommé ajout.php et qui va ajouter les données
saisies dans notre base de donnés. Voici comment est codéce fichier ajout.php :
Le fichier ajout.php (permettant d’inséer une news dans notre table news) :
Dans ce code à la 2ème ligne, on insère le fichier de connexion à la base de donnés. On récupére les données saisies «
pseudo », « titre » et « news » grâce à la commande POST. Un nouveau mot apparaît ici. C’est le terme isset. Il permet de
savoir si la variable est définit ou non dans le formulaire précédent.
Chaque valeur récupérée est transmise dans une variable. Attention, le nom de cette variable doit correspondre au nom de
votre champ dans votre table de votre base de données.
Ensuite, je teste pour chaque valeur transmise si elle n’est pas nulle ou vide. C’est la fonction empty qui me le permet. Si une
des valeurs est vide, j’affiche un message.
Ensuite, j’insère chaque valeur dans ma base de données grâce à la commande SQL Insert Into …
Puis, je ferme la base de données et j’affiche un message pour dire que tout c’est bien passée.
<?php
include ('config.php');
if (isset($_POST['pseudo']) AND isset($_POST['titre']) AND isset($_POST['news']))
{
$pseudo = htmlentities($_POST['pseudo']);
$titre = htmlentities($_POST['titre']);
$news = mysql_real_escape_string(stripslashes($_POST['news']));
$news = nl2br($news);
if (empty($pseudo))
{
echo ("Saisissez votre pseudo");
exit();
}
if (empty($titre))
{
echo ("Le titre ne peut être vide");
exit();
}
if (empty($news))
{
echo ("Saisissez une actualité pour votre site");
exit();
}
mysql_query ("Insert INTO news VALUES ('', ' " .$pseudo. " ', ' " .$titre. " ', ' " .$news. " '
}
mysql_close();
echo 'Merci d'avoir ajouter une news - Redirection automatique dans 5 secondes';
echo "<META HTTP-EQUIV='Refresh' CONTENT='5; URL=http://127.0.0.1/apprendre_le_php/news/news.php
?>
L’affichage de tous les titres de news ainsi que leur auteur : (liste_news.php) :
Ici,titre
le
de
Entre
la
grâce
news
chaque
de àchaque
ainsi
la commande
variable,
que
news,
le iltitre
je
faut
SQL
fais
grâce
mettre
Select,
un à
lien
la
le hypertexte
méthode
je
signe
vais&afficher
(et
GET,
qui
commerciale)
m’amènera
le
c’est-à-dire
pseudo et
traduit
àque
le
la titre
description
c’est
ende
html
valeur
chaque
par
de
seront
&la
news
; news.
transmises
que
Ici,j’ai
jesaisi
vais
dans
grâce
faire
la barre
passer
au formulaire.
d’adresse.
l’identifiant
Sur
Bon voyons un peu plus le charabia suivant :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Affichage de toutes les actualités du site</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<?php
include ('config.php');
$reponse = mysql_query ("SELECT * FROM news ORDER BY id");
while ($donnees = mysql_fetch_array($reponse))
{
?>
<div class="toutes_news">
<div class="pseudo_toutes_news"><?php echo $donnees['pseudo'];?></div>
<div class="titre_toutes_news"><a href="affichage_news.php?id=<?php echo $donnees['id'];?>&amp;t
</div>
<?php
}
mysql_close();
?>
</body>
</html>
La commande a href est la commande permettant de créer un lien hypertexte.
Je veux créer ce lien sur la page affichage_news.php mais je veux seulement afficher une news donc il me faut récupérer
l’identifiant (id) de la news. En même temps, je peux récupérer le titre. On n’est pas obligé puisque l’identifiant est unique mais
comme je veux vous montrer le & donc je récupére aussi le titre. Ensuite, j’affiche le titre de la news pour pouvoir faire le lien
dessus.
L’affichage de la news lorsque l’on clique sur le titre d’une news : (affichage_news.php) :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Affichage des news</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<?php $id_news = $_GET['id'];?>
<?php
include ('config.php');
$reponse = mysql_query ("SELECT * FROM news WHERE id='$id_news' ");
while ($donnees = mysql_fetch_array($reponse))
{
?>
<?php echo nl2br(htmlentities($donnees['news']));?>
<?php
}
mysql_close();
?>
</body>
</html>
Ici dans ce code, je commence à récupérer l’identifiant transmise dans l’URL. Donc, je le récupère grâce à la méthode GET. Je
lui assigne une variable nommée $id_news.
Ensuite, grâce à la commande SELECT, je sélectionne l’’identifiant dont l’identifiant est égale à l’identifiant transmis et j’affiche
grâce à la commande echo la news de ce même identifiant.
Le fichier config.php (permettant la connexion à la base de données) :
<?php
mysql_connect("localhost", "root", ""); // Connexion à la base de données
mysql_select_db("toto"); // Sélection de la base de données
?>
Ce fichier est absolument nécessaire pour se connecter à la base de données.
La table news :
Dans PhpMyAdmin, construisez la table news de la manière suivante :
Champs
id
pseudo
titre
news
Voila,pouvez
vous
maintenant,
faire un
vous
copier
pouvez
/ coller
essayer
des codes
d’insérer
précédents.
une news dans votre table. Le mieux, c’est de faire le code vous-même mais
Ty
IN
va
va
lon

Documents pareils