Envoyer un formulaire et enregistrer un jeu

Liens utiles

• MDN - Élément form

  Pour revoir le rôle de la balise <form>.

• MDN - Élément input

  Pour revoir les types de champs et leurs attributs.

• PHP Manual - Formulaires

  Pour comprendre comment PHP reçoit les données envoyées.

• PHP Manual - filter_var

  Pour vérifier qu'une valeur a le bon format.

• PHP Manual - file_put_contents

  Pour écrire du texte dans un fichier.

1. Comprendre le rôle du formulaire

Un formulaire sert à envoyer des informations saisies par l'utilisateur. Dans cette étape, il sert à ajouter un nouveau jeu dans la liste.

Le navigateur affiche le formulaire. Quand l'utilisateur clique sur le bouton, les données partent vers le serveur. PHP les reçoit, les vérifie, puis décide quoi faire.

1. Garde l'idée suivante en tête : le formulaire affiche les champs, PHP traite les réponses.
2. Prévois une page pour le formulaire et une autre page pour le traitement.

2. Créer une page séparée pour le formulaire

La page principale doit rester lisible. Elle affiche les cartes et propose un lien vers une page dédiée au formulaire.

La page du formulaire peut réutiliser le même header et le même footer que la page principale. Si tu as créé des fichiers communs avec include, réutilise-les ici.

1. Crée une page new-game.php.
2. Ajoute un titre clair, par exemple Ajouter un jeu.
3. Ajoute un court texte qui explique que le formulaire permet d'ajouter une carte.
4. Sur la page principale, ajoute un lien vers new-game.php.

3. Ajouter la balise form

La balise <form> regroupe les champs à envoyer. Deux attributs sont très importants :

• method="post" envoie les données dans la requête HTTP, pas dans l'adresse visible.
• action="..." indique quel fichier PHP reçoit les données.

<form method="post" action="traitement.php">
    <!-- Les champs seront placés ici. -->
</form>

1. Dans new-game.php, ajoute une balise <form>.
2. Utilise la méthode post.
3. Configure l'action pour envoyer vers add-game.php.

4. Comprendre label, input et name

Un champ de formulaire doit être compréhensible. Le <label> donne le texte visible, et le champ <input> permet la saisie.

L'attribut name est indispensable : c'est le nom que PHP utilisera pour retrouver la valeur envoyée.

<label for="username">Nom utilisateur</label>
<input id="username" type="text" name="username">

Le for du label correspond au id du champ. Cette association aide le navigateur à comprendre que le texte appartient au champ.

1. Ajoute un champ texte pour le titre du jeu avec un label associé.
2. Donne au champ le nom title.
3. Vérifie que le for du label correspond bien au id du champ.

5. Ajouter les autres champs

Il existe plusieurs types de champs. Le type donne une indication au navigateur : texte simple, nombre, lien, zone longue, etc.

<input type="text" name="city">
<input type="number" name="age" min="0" max="120">
<input type="url" name="website">
<textarea name="message"></textarea>

1. Ajoute un champ texte category pour la catégorie du jeu.
2. Ajoute une zone textarea nommée description.
3. Ajoute un champ nombre rating pour la note.
4. Ajoute un champ URL link pour un lien facultatif vers le site du jeu.

6. Ajouter une première validation HTML

Le HTML peut déjà aider l'utilisateur à remplir correctement le formulaire. Cette vérification est pratique, mais elle ne remplace jamais la validation PHP.

• required demande au navigateur de bloquer l'envoi si le champ est vide.
• min indique la plus petite valeur acceptée pour un nombre.
• max indique la plus grande valeur acceptée pour un nombre.

<input type="number" name="quantity" min="1" max="20" required>

1. Rends obligatoires le titre, la catégorie, la description et la note.
2. Limite la note entre 0 et 10 avec min et max.
3. Laisse le lien facultatif : il peut rester vide.

7. Créer le fichier de traitement

Le fichier de traitement ne sert pas à afficher une page complète. Il reçoit les données, les vérifie, les enregistre, puis redirige.

On vérifie d'abord que la page a bien été appelée avec la méthode POST. Sinon, cela veut dire que quelqu'un a ouvert directement le fichier de traitement.

$_SERVER est une variable spéciale de PHP qui contient des informations sur la requête en cours. Ici, $_SERVER['REQUEST_METHOD'] permet de savoir si la requête est en GET ou en POST.

if ($_SERVER['REQUEST_METHOD'] !== 'POST') {
    header('Location: accueil.php');
    exit;
}

1. Crée add-game.php.
2. Au début du fichier, vérifie que la méthode est bien POST.
3. Si ce n'est pas le cas, redirige vers la page principale.

8. Lire les valeurs envoyées

PHP range les données d'un formulaire POST dans $_POST. C'est un tableau associatif : chaque valeur est retrouvée grâce à son name.

L'opérateur ?? signifie : utilise la valeur si elle existe, sinon utilise la valeur de secours.

La fonction trim retire les espaces inutiles au début et à la fin d'un texte.

$username = trim($_POST['username'] ?? '');
$message = trim($_POST['message'] ?? '');

1. Lis title, category, description, rating et link.
2. Utilise trim sur les valeurs textuelles.
3. Prévois une valeur vide si une donnée n'existe pas.

9. Valider les champs obligatoires

Il faut toujours valider côté serveur, même si le formulaire HTML utilise déjà required. Le navigateur peut être contourné, mais le serveur reste responsable de ce qu'il accepte.

Une condition permet de détecter une donnée manquante. L'opérateur === vérifie qu'une valeur est exactement égale à une autre. L'opérateur || veut dire « ou » : si une des conditions est vraie, le bloc du if s'exécute.

if ($username === '' || $message === '') {
    header('Location: formulaire.php?error=missing');
    exit;
}

1. Vérifie que le titre n'est pas vide.
2. Vérifie que la catégorie n'est pas vide.
3. Vérifie que la description n'est pas vide.
4. En cas d'erreur, redirige vers le formulaire avec un message simple dans l'URL.

10. Valider la note et le lien

filter_var permet de vérifier le format d'une valeur. Pour un nombre entier, on peut utiliser FILTER_VALIDATE_INT. Pour une URL, on peut utiliser FILTER_VALIDATE_URL.

$age = filter_var($_POST['age'] ?? null, FILTER_VALIDATE_INT);
$website = trim($_POST['website'] ?? '');

if ($age === false) {
    header('Location: formulaire.php?error=age');
    exit;
}

if ($website !== '' && filter_var($website, FILTER_VALIDATE_URL) === false) {
    header('Location: formulaire.php?error=url');
    exit;
}

1. Vérifie que la note est bien un nombre entier.
2. Si le lien est vide, accepte-le.
3. Si le lien est rempli, vérifie que c'est une URL valide.

11. Forcer la note entre 0 et 10

Même après validation, on peut sécuriser la valeur avec min et max. Cela garantit que la note reste dans les limites prévues.

$score = max(0, min(100, $score));

1. Applique le même principe à la note du jeu.
2. La note ne doit jamais être inférieure à 0.
3. La note ne doit jamais être supérieure à 10.

12. Préparer le nouveau jeu

Le nouveau jeu doit avoir la même structure que les jeux déjà présents dans le JSON. Pour cela, on prépare un tableau associatif.

$newItem = [
    'name' => $name,
    'score' => $score,
    'isActive' => true,
];

1. Crée un tableau pour le nouveau jeu.
2. Utilise les clés title, category, rating, description, image et link.
3. Pour l'image, utilise une image par défaut, par exemple placeholder.svg.

13. Lire la liste existante

Avant d'ajouter le nouveau jeu, il faut récupérer la liste actuelle. On lit donc le fichier JSON, puis on le transforme en tableau PHP.

Si le fichier n'existe pas ou contient une erreur, on peut repartir d'un tableau vide.

$items = [];

if (file_exists($path)) {
    $content = file_get_contents($path);
    $decodedItems = json_decode($content, true);

    if (is_array($decodedItems)) {
        $items = $decodedItems;
    }
}

1. Crée une variable qui contient le chemin vers games.json.
2. Vérifie que le fichier existe.
3. Lis son contenu avec file_get_contents.
4. Transforme le JSON avec json_decode.
5. Si le résultat est bien un tableau, garde-le.

14. Ajouter puis enregistrer

Pour ajouter un élément à la fin d'un tableau PHP, on peut utiliser la syntaxe []. Ensuite, on transforme le tableau en JSON et on écrit le résultat dans le fichier.

$items[] = $newItem;

$json = json_encode($items, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE);
file_put_contents($path, $json);

• JSON_PRETTY_PRINT rend le fichier plus lisible.
• JSON_UNESCAPED_UNICODE garde les accents lisibles dans le JSON.
• file_put_contents écrit le texte dans le fichier.

1. Ajoute le nouveau jeu à la liste.
2. Convertis la liste en JSON.
3. Réécris games.json.

15. Rediriger après le traitement

Après un traitement POST réussi, on redirige vers une page d'affichage. Cela évite de renvoyer le formulaire si l'utilisateur recharge la page.

header('Location: accueil.php?success=1');
exit;

exit arrête immédiatement le script. C'est important après une redirection : le serveur ne doit pas continuer le traitement.

1. Après l'enregistrement, redirige vers la page principale.
2. Ajoute un paramètre de succès dans l'URL si tu veux afficher un message.
3. Ajoute toujours exit juste après header.

16. Afficher un message sur le formulaire

Si le traitement détecte une erreur, il peut rediriger vers le formulaire avec un paramètre dans l'URL. La page du formulaire peut lire ce paramètre avec $_GET.

$message = $_GET['error'] ?? '';

if ($message !== '') {
    echo 'Une erreur est arrivée.';
}

1. Sur new-game.php, lis un éventuel paramètre error.
2. Si une erreur existe, affiche un message simple avant le formulaire.
3. N'affiche pas de message si tout va bien.

Critères de réussite

• La page principale contient un lien vers la page du formulaire.
• Le formulaire est dans une page séparée.
• Le formulaire utilise method="post".
• Le traitement se fait dans un fichier séparé.
• PHP vérifie la méthode HTTP avant de traiter.
• PHP lit les données dans $_POST.
• Les champs obligatoires sont validés côté serveur.
• La note est validée puis limitée entre 0 et 10.
• Le lien est facultatif, mais vérifié s'il est rempli.
• Le nouveau jeu est ajouté dans games.json.
• Après l'ajout, la page principale affiche le nouveau jeu.

Erreurs fréquentes à vérifier

• Le name du champ HTML ne correspond pas à la clé lue dans $_POST.
• Le fichier de traitement affiche du HTML avant une redirection header.
• Il manque exit après une redirection.
• Le JSON est écrasé avec une chaîne vide à cause d'une variable mal nommée.
• Le fichier games.json n'est pas placé au bon endroit.