PHP - #06 - Formulaire de note d'un élève à remplir qui affiche son nom et ses notes + Bonus

3 min read 1 hour ago
Published on Sep 24, 2024 This response is partially generated with the help of AI. It may contain inaccuracies.

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() or print_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.