Sign In
Create Account
Follow Us on Twitter
Subscribe on Youtube
Setting up the Page
First of all, let's just make a nice HTML page with some CSS formatting:
<html>
<head><title>Result Page</title>
<style type="text/css">
html, body
{
margin: 0;
padding: 0;
}
body
{
font-family: Arial;
background-color: black;
color: white;
}
</style>
<body>
The page will use Arial as the base font, and will have a white-on-black colour scheme. Adjust as required.
Extracting the Data
Right, now we need to grab that data we sent with the page. We can do this in PHP.
The method we use is to use one of two special variables:
- $_GET[] - for GET requests
- $_POST[] - for POST requests
Both are associative arrays - this means we can provide the key for it, and it returns the value.
Let's open a PHP script:
<?php //Get the first name and last name. //Concatenate into one string variable, called $name. $name = $_GET["foreName"] . " " . $_GET["surName"];
So what have we done here? First, we've retrieved the two data values we sent in the previous tutorial. Notice how the key corresponds to the name attribute we gave the input tags.
We use the PHP concatenation operator, ".", to join the two variables together with a space inbetween. This is stored in the variable called $name (remember, anything starting with a $ is a variable).
If you used the method="post" attribute, then use the $_POST[] array instead. It depends on what you used when you sent the data.
Displaying the Data
Now we just need to print the data into the HTML page that is returned back to the user's browser. This is where the PHP "echo" function comes in:
echo "Pleased to meet you, $name."; ?>
The use of the double quotes means that the PHP parser reads the variable name in the string and replaces it with the value it holds. We then end the PHP script with ?>.
Finally, we don't want W3C coming and killing us, so let's round off the page:
</body> </html>
Run the script under a server (either local or online). Type your name into the two boxes, and click the submit button. Your name should be integrated into the result page.
Conclusion
This concludes the introduction to Form Submission. This technique forms the basis of all form requests that are used on all sorts of sites, so hopefully you will be able to build on your skills from here and create some amazing sites!
Test yourself: Write a form submission where you type the name of the image you want to view. In the result page, this image appears in the form of an <img> tag.
Please +rep if useful. Leave any comments/praise here!
Back to top
