PHP - #06 - Formulaire de note d'un élève à remplir qui affiche son nom et ses notes + Bonus
Table of Contents
Introduction
This tutorial will guide you through creating a student grading form using PHP and HTML. You'll learn how to build a form that captures a student's name and grades, displays the information, and addresses any common issues you might encounter. By the end of this tutorial, you will have a functional web application that can be enhanced or expanded based on your needs.
Step 1: Set Up Your Project Structure
- Create a new folder for your project.
- Inside this folder, create the following files:
index.php
(for the form)result.php
(for displaying the results)
Step 2: Create the HTML Form
-
Open
index.php
and start with the basic HTML structure:<!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <title>Formulaire de Note d'Élève</title> </head> <body>
-
Add a form that collects the student's name and grades:
<form action="result.php" method="post"> <label for="name">Nom:</label> <input type="text" id="name" name="name" required> <label for="grade">Notes:</label> <input type="number" id="grade" name="grade" required> <input type="submit" value="Envoyer"> </form>
-
Close the HTML tags:
</body> </html>
Step 3: Process the Form Data with PHP
-
Open
result.php
to handle the form submission. -
Start with the PHP opening tag and retrieve the submitted data:
<?php $name = $_POST['name']; $grade = $_POST['grade']; ?>
-
Display the submitted information:
<h1>Résultat</h1> <p>Nom: <?php echo htmlspecialchars($name); ?></p> <p>Note: <?php echo htmlspecialchars($grade); ?></p>
-
Ensure the HTML structure is consistent:
<!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <title>Résultat de la Note</title> </head> <body> <h1>Résultat</h1> <p>Nom: <?php echo htmlspecialchars($name); ?></p> <p>Note: <?php echo htmlspecialchars($grade); ?></p> </body> </html>
Step 4: Troubleshooting Common Issues
- Ensure your web server (like XAMPP or WAMP) is running to process PHP files.
- Check for syntax errors in both PHP and HTML code.
- Use
var_dump()
orprint_r()
to debug if data is not displaying correctly.
Step 5: Display Additional Information (Optional)
- You can extend the form to include more grades or different subjects.
- Use arrays to handle multiple grades:
$grades = $_POST['grades']; // Assuming grades is an array foreach ($grades as $grade) { echo "<p>Note: " . htmlspecialchars($grade) . "</p>"; }
Conclusion
In this tutorial, you learned how to create a basic student grading form using PHP and HTML. You set up the project structure, created a form, processed the data, and displayed the results. As a next step, consider adding features like validation, saving data to a database, or expanding the form to handle multiple students. This foundation will help you build more complex web applications in the future.