Step 9 : Creating Fillout Forms
How would you like visitors to your page provide information about themselves, register for something, or just say Hi! All this can be done with CGI forms which your visitors can fill out online and the content will be e-mailed directly to you.
Creating a basic Feedback Form step by step.
Lets learn by putting together a basic feedback form for your page. We begin with the <FORM> tag.
<BODY>
<B>Feedback Form</b><BR>
<FORM>
</FORM>
</BODY>
|
Now we have to specify some parameters for the form.
<BODY>
<B>Feedback Form</b><BR>
<FORM ACTION="mailto:homepages@rediff.co.in" METHOD=POST>
</FORM>
</BODY>
|
The above has a two parameters ACTION and METHOD. The ACTION parameter specifies the action to be taken once the form has been submitted. It is usually a URL or as in the above example a mailto link. The METHOD specifies the form is sent to the server. It should be set to POST.
Now lets put some elements in the form. Form elements are the fields of information which the visitor has to fill out. Lets start with the name and email fields. For Form elements we use the <INPUT> tags.
<BODY>
<B>Feedback Form</b><BR>
<FORM ACTION="mailto:homepages@rediff.co.in" METHOD=POST>
Name : <INPUT NAME="NAME" TYPE=TEXT" SIZE=20><BR>
<BR>
Email : <INPUT NAME="EMAIL" TYPE=TEXT" SIZE=20><BR>
</FORM>
</BODY>
|
Here is how the two fields look..
Now we ask the user what he thinks of your page by providing a textbox for him to write his comments in.
<BODY>
<B>Feedback Form</b><BR>
<FORM ACTION="mailto:homepages@rediff.co.in" METHOD=POST>
Name : <INPUT NAME="NAME" TYPE=TEXT" SIZE=20><BR><BR>
Email : <INPUT NAME="EMAIL" TYPE=TEXT" SIZE=20><BR><BR>
Comments : <BR>
<TEXTAREA COLS=50 ROWS=7 NAME="COMMENT">
</TEXTAREA>
</FORM>
</BODY>
|
We now complete the form with a Submit button and a Reset button.
<BODY>
<B>Feedback Form</b><BR>
<FORM ACTION="mailto:homepages@rediff.co.in" METHOD=POST>
Name : <INPUT NAME="NAME" TYPE=TEXT" SIZE=20><BR><BR>
Email : <INPUT NAME="EMAIL" TYPE=TEXT" SIZE=20><BR><BR>
Comments : <BR>
<TEXTAREA COLS=50 ROWS=7 NAME="COMMENT">
</TEXTAREA><BR><BR>
<INPUT TYPE="SUBMIT" VALUE="Submit (Click only once)">
<INPUT TYPE="RESET" VALUE="Reset">
</FORM>
</BODY>
|
You now have a ready to use feedback form. When the visitor clicks on the submit button the information he has filled in the form will be e-mailed to you.
Top
|
Case Study : Ram Chandran's Homepage
No homepage would be complete without a feedback form. Here's Ram's Ram's Feedback Form.
To view the code of the example file use the view source option of your browser.
|
10 Mb free for life!
