This tutorial explains the basics of a web form, how it works and how you can make a web form from scratch.
How does a web form work?
A visitor visits a web page that contains a form.
The web browser displays the HTML form.
The visitor fills in the form and submits
The browser sends the submitted form data to the web server
A form processor script running on the web server processes the form data.
The processing steps can include:
sending the form submission by email
saving the submission to a database table or a file.
A response page is sent back to the browser.
The parts of a web form
A standard web form has the following parts:
- The HTML code for the form
- Input validations.
- Form processor script.
1. The HTML code for the form
HTML has tags for creating a web form and the input elements. The HTML Form Tutorial contains detailed explanation of how to compose a web form. Here is some sample code for a simple HTML form:
<form action="cgi-bin/formmail.pl" method="post"> Name: <input type="text" name="name" value="" size="25" maxlength="50" /> Email: <input type="text" name="email" value="" size="25" maxlength="50" /> <input type="submit" name="submit" value="sign me up!" /> </form>
The HTML code above creates a form like this:
2. The input validations
3. Form Processor Script
When you submit a web form, the web browser looks for the ‘action’ attribute of the form tag. For an example, in the sample HTML form code above, the action attribute points to a script located at
"/cgi-bin/formmail.pl". The web browser sends the form submission data to the script mentioned in the ‘action’ attribute.
The server side script can be in Perl, PHP or ASP depending on what the web server supports.
The action-script on the server can be custom made or can be a ready-made one. There are ready-made scripts available that can send the form submissions to your email address. See the Form mail scripts page. For examples of saving form submissions to a database, see the form processing script page.
Making a web form
To make a complete web form, you need to code these three parts of the form.
- How to make a web form and get it online quickly
- Using the window.close method
- Using the window.open method
- From an HTML Form to an Email Inbox
- How to get the value of a form element : Drop downs and lists
- How to get the value of a form element : check box and radio button