Categories

[PHP Tutorial 5] Creating Forms with PHP

2

In the previous PHP tutorial on WHILE and DO WHILE in PHP, you learnt how to use WHILE and DO WHILE loops in PHP. In this tutorial, you will learn how to create forms with PHP.

We come across a number of application forms while signing up on websites, registering for competitions, submitting a brief bio data, etc. Ever wondered how these forms are created? Let’s create an application form which asks for basic information from candidates. We will first look at the PHP code to create a basic form and then discuss how it works. Copy and paste the code given below on notepad & save it as form.php.

<?php
?>
First Name <input type="text" name="text box1" value=" "><br>
Last Name <input type="text" name="text box2" value=" "><br><br>

Age<input type="text box3" name="age"><br><br>

Gender<br>
<Input type = 'Radio' Name ='gender1' value= 'male'>Male<br>
<Input type = 'Radio' Name ='gender2' value= 'female'>Female<br><br>

Email <input type="text" name="thebox" value=" "><br><br>

Your Qualification<br>
<Input type = 'Checkbox' Name ='check box 1' value ="Student">Student<br>
<Input type = 'Checkbox' Name =' check box 2' value ="Graduate" >Graduate<br>
<Input type = 'Checkbox' Name =' check box 3' value ="Post Graduate">Post Graduate<br>
<Input type = 'Checkbox' Name =' check box 4' value ="Doctorate" >Doctorate<br><br>

Describe Yourself<br>
<textarea name="message">
</textarea><br><br>

<input type="submit" value="Submit"><input type="reset" value="Reset">

 

Now, open your web browser and type localhost/form.php. The following form will appear in the browser:

This is an application form deriving basic information and is the general layout of all registration forms. We will now discuss the code in detail.

First Name <input type="text" name="text box1" value=""><br>


<Input type> is a tag that is used to input text boxes, check boxes, radio button, submit button, etc. Depending on what you want to display on your page, you can write that in the inverted commas. “text” will display a text box where the user will be able to write. Before input type, you can write anything you want to describe for the boxes.Eg, First Name, Last Name, Place of Residence, Contact No. etc. Name “ text box 1“ is just the name of that text box to distinguish from other statements containing text boxes. It will not appear on the web page. Under value, you can write something that you want the user to see and use it as a hint. Eg, “type your first name” or you can leave it as blank.

<br> has been used to make the next statement in the next line. If you write it two times, it will leave two line spaces.

Similar is the code for last name and age also.

 

<Input type = 'Radio' Name ='gender1' value= 'male'>


Here, the input type is Radio, it will provide a radio button on the web page. ‘gender1’ is just the name of the radio button. Name and value are just for reference sake, as said above. After this statement, if you write “Male”, it will appear on the webpage. In the same way, for creating a radio button for female as an option, everything will be same and you just need to write ‘female’ after the input statement.

 

<Input type = 'Checkbox' Name ='check box 1' value ="Student">


If you want to give several options to the user to choose from, you can use check box input type. Under that, you can then provide options. You need to write this code for every check box you want to display on the form.

 

<textarea name="message">

</textarea><br><br>

 

 

There is a message box also in some application forms where you are to write about yourself, your brief resume, achievements, awards etc. That can be displayed on the form using <text area>. After this tag, if you want to give the user a hint, you can write something; that will appear inside the text message and can be erased by the user. You need to close this tag using </text area>

 

<input type="submit" value="Submit"><input type="reset" value="Reset">


 

At the end of every form, there’s a submit button. By mentioning the input type as “submit”, the box will appear. If you want “submit” to be written on the box, you can give the value as “submit”. Some websites also use “Send Details” or simply “Send”. Default value of submit button is “Submit Query”. In some forms, a reset button is given that omits all the filled detail in the form so that you can fill your data again. This option is useful if you have mistakenly filled wrong data or want to enter some other detail in the form. Rather than deleting each fill up, by pressing the reset button you can delete all at one. This reset button can be provided by giving the input type as “reset”.

If the code looks complex, you can remove “name” and “value”; it will still work.

Since PHP is similar to HTML, you can also try this with html. If you don’t have PHP installed in your system, you can experiment with this code using notepad and your web browser. But for that you need to save the code in the notepad with the extension .html

So, paste the above code in the notepad and save it as form.html. A webpage will be created, open it and see the result.

Now that you know how to create forms in PHP, continue with the next tutorial on how to use GET and POST methods in PHP. Also, if you have any queries, please leave a comment below.

Share.

2 Comments

  1. input type “submit” will let you have the submit button and under value, you can write anything you want it to be written over the button. If you write “submit details”, a button with the same name appears. So, value is nothing but the name of that submit button. Regarding posting the filled data, you can use the following:
    <form action=”yourscript.php” method=”post”>
    </form >

    where “yourscript” is the php script where you want to post the filled data and “POST” method is used for this purpose.
    Write the code within the form tags shown above.
    It was not covered in this tutorial as it just meant to introduce the code for creating forms.

Leave A Reply