HTML Resources

HTML Form help

Location of the HTML file

The location of HTML documents depends on the particular web server installation. Typically, HTML documents live in a special directory or sub-directories of that directory. The actual location of that directory can vary, but is often /var/www/html.

The web server may be set up to allow HTML documents to be placed in other locations including a sub-directory of your home directory generally called public_html.

At Birkbeck, you need to follow the instructions to create a WWW directory in which you will place your web pages.

Overall HTML structure

<html>
<head>
<title>My form</title>
</head>
<body>

...HTML goes here...

<form action='URL-of-CGI-script' method='post'>

...form elements and HTML goes here...
...don't forget the submit button!...

</form>

...more HTML goes here...

</body>
</html>

Depending on the configuration, your URL-of-CGI-script may have to start with http: or https:. If one doesn't work, try the other!

Useful form elements

Element Description
<input type='checkbox' /> Creates a tick box. You must specify a name= tag and a value= tag. If the checkbox is clicked, the name/value pair will be sent to the server when the submit button is pressed.
<input type='radio' /> Creates a radio button. You must specify a name= tag and a value= tag. Radio buttons are grouped together by giving them the same name – only one of these can be selected at a time. The one name/value pair will be sent to the server when the submit button is pressed.
<input type='reset' /> Creates a reset button to clear the form. No other attributes need to be set, but the value attribute will set the label on the button.
<input type='submit' /> Creates a submit button to send the form to the web server. No other attributes need to be set, but the value attribute will set the label on the button.
<input type='text' /> Creates a one-line box in which text can be entered. You must specify a name= attribute and should include a size= attribute to specify how wide the box is. It is also useful to specify a maxlength= attribute to specify the maximum number of characters that can be typed.
<select> Creates a multiple choice pull-down menu or a scrolling list. You must specify a name= attribute. The size= attribute specifies the number of items to display (i.e. The number of rows shown) – if 1, then a pull-down menu is shown rather than a scrolling list. The multiple='multiple' attribute allows more than one item to be selected from a scrolling list. The actual options are specified in <option></option> tags which follow the <select> tag. The end of the list is indicated with a </select> tag.
<textarea> Creates a large box in which text can be entered. You must specify a name= attribute and should include cols= and rows= attributes to specify the size of the box. You must also include a </textarea> closing tag – any text between the opening and closing tags will appear as the default text in the box.
Continue