PHP form tutorial


Home - Tutorials - Forms

This article demonstrates how to use PHP forms. You will find detailed information from the form basics to advanced form processing.

Tutorial info:


Name:PHP form tutorial
Total steps:3
Category:Forms
Level:Beginner

Bookmark PHP form tutorial



Bookmark and Share

Step 1 - PHP form introduction


PHP form tutorial

If you have ever made any  HTML page or started dynamic web programming then you probably have already meet with forms. Forms are special components which allows your site visitors to supply various information on the HTML page.

For example almost each company web site has a contact form where the visitor can send a message to the site owner. On such a contact form usually there are more fields: one for the visitor name, one for the email address and one for the main message itself. The HTML code of a basic contact form looks something similar:

Code:
  1. <form action="form.php" method="POST">
  2. <td>Name:</td>
  3. <td><input type="text" name="name"></td>
  4. </tr>
  5. <td>Email:</td>
  6. <td><input type="text" name="email"></td>
  7. </tr>
  8. <td>Message:</td>
  9. <td><textarea name="mesg"></textarea></td>
  10. </tr>
  11. <td><input type="submit" name="SubmitForm" value="Send"></td>
  12. </tr>

This code results an output like this:

Basic PHP form

Explanation:

The form tag: 

The most important part of this code is in line 1. where the form begins. No small wonder we start a form with the <form> tag. As the form is a container so you can find the closing tag in line 18. The <form> tag has more parameters but the most important are the action and the method

What these parameters do?

Action: The action parameter tells to the browser what script/site must be called when the visitor pressed the submit button. In our case the browser will load the form.php file which will process the submitted information. See details later.

Method: The method parameters tells to the browser in which form to send the user submitted data to the web-server. The parameter value is either POST or GET. However nowadays POST is more often used as it is more secure.

The <form> tag has many more parameters but now they are not important. The most form uses only these 2 parameters. 

 

The input fields:

Inside the form we have a table just to display it in a usable format. Each table row has 2 cells. In the first cell you can find a label to the input field and in the second cell there is the <input> tag itself. In this example we have 2 text fields in line 5 and line 9. These fields are for the user name and email address. As you can see both fields are <input> tags with the type parameter set to text.

However the 3rd input field (Line 13) is a bit different. It is a textarea which is a special field and the usage is a bit different. This type of field was designed to make it available to write text in more lines.

One more important point is the name parameter for all the 3 input fields. This parameter helps identify the field value later during the form processing. It is important to give unique name for each field. If you don't follow this rule then you will not get any error message but during the form processing there will be some interesting surprise as you can not precisely identify inputs. See details later. 

 

The submit button:

The last important element is the submit button itself in line 16. It is again an <input> tag as the text fields in line 5,9 however its type is different. This is an <input> tag with type submit. This field is displayed as button in your browser and you can "only" click on it. And this click triggers the browser to submit the form to the server and call the script defined in the action parameter.

The value parameter is not mandatory. It is a text which will be on the button, but without this a default value will be used.

However the name parameter is again has an important rule as later you will check it during the form processing. See details in the next step. 

 

In the next step we will process the submitted data.





Next Step of PHP form tutorial


Tags: php form processing, php form, creating form, form processing



Follow phpf1 on Twitter




F1 Site Family
AJAX F1
CSS F1
Database F1
Flash F1
HTML F1
Java F1
JavaScript F1
PhotoShop F1
PHP F1
Scripts F1
Tutorial F1
Windows F1

Total time: 0.062