Web Development Lesson 8 - Forms

In this activity you will learn one way to send data between pages.

• Create two files in Visual Studio Code and name them 'form.php' and 'process_form.php'.
• Add the basic code in each to include our header, menu and footer files.

• Open 'forms.php' and add <main> tags.
• Add a paragraph inside the <main> tag that says 'Choose your hero.'
• Add a list below the paragraph. You choose whether you want an ordered or unordered list.
• Create two list items, each containing a link.
• The link text will be 'Loki' and 'Hulk' respectively.
• The first link href will be 'process_form.php?name=Loki'.
• The second link will be the same but with Hulk instead of Loki.
• Your final code should look like this.

    <main>
        <p>Choose your hero.</p>
        <ol>
            <li><a href="process_form.php?name=Loki">Loki</a></li>
            <li><a href="process_form.php?name=Hulk">Hulk</a></li>
        </ol>
    </main>

• In both cases, the link will take the user to our other page 'process_form.php' which we will use to process the data.
• Each link includes a ? following the filename, then the name of the hero chosen.
• We've intentionally only used hero names that are only one word long because spaces are slightly more complex.
• Save and upload the code, then open the page and click one of the heroes.
• You should see the data corresponding to the hero you chose.
• You've now passed data from one page to another using a URL parameter. This is also known as sending data via GET.

• In PHP, we can obtain this data by 'getting' it from the URL.
• All data in the url is automatically stored in an array called '$_GET'.
• Open 'process_form.php'.
• Add the following code inside your <main> tag.

        <p>You have chosen <?php echo $_GET['name']; ?></p>

• This displays text and includes the name you chose in 'form.php'.
• Save and upload the code, then open 'form.php' and click on a hero.
• Check that your choice is reflected in the text on the new page.

Next: Inputs