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 :
La page en css (style.css)
|
/* Creation du formulaire de news */ .titre_actu { .titre_zone_texte { .zone_texte { .bouton { /* Affichage toutes les news */ .toutes_news { .pseudo_toutes_news { .titre_toutes_news { |
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.dtd">
<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> |
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'>"; ?> |
Ici, grâce à la commande SQL Select, je vais afficher le pseudo et le titre de chaque news que j’ai saisi grâce au formulaire. Sur le titre de chaque news, je fais un lien hypertexte qui m’amènera à la description de la news. Ici, je vais faire passer l’identifiant de la news ainsi que le titre grâce à la méthode GET, c’est-à-dire que c’est valeur seront transmises dans la barre d’adresse. Entre chaque variable, il faut mettre le signe & (et commerciale) traduit en html par & ;
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.dtd"> <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> |
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.dtd"> <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'];?> |
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 ?> |
La table news :
Dans PhpMyAdmin, construisez la table news de la manière suivante :
|
Champs
|
Type
|
Taille
|
Extra
|
Clé primaire
|
|
id
|
INT
|
Auto_increment
|
*
|
|
|
pseudo
|
varchar
|
50
|
||
|
titre
|
varchar
|
50
|
||
|
news
|
longtext
|
Voila, maintenant, vous pouvez essayer d’insérer une news dans votre table. Le mieux, c’est de faire le code vous-même mais vous pouvez faire un copier / coller des codes précédents.