Version 3.1
Reference Guide

HTML Form Tags

Previous | Next
Contents

The first step in allowing users to publish articles on your web server is to create an HTML form in which authors will enter information. Creating HTML forms that allow user input is relatively straightforward and the process is well documented in many places on the Web. Here is a quick reference for the most common form tags and their attributes.

The FORM Tag

An HTML form is defined by a beginning <FORM> tag and an ending </FORM> tag. In between these form tags are various INPUT tags which define the look and behavior of the input fields in the form.

Every FORM tag used with NetCloak must have at least two attributes:

1.   An ACTION attribute which tells the web server that NetCloak is to process the input data.

2.   A METHOD attribute which describes how the input data is sent from the browser to the server.

The ACTION Attribute

It is the ACTION attribute that tells the browser (which tells the server) how to process the data from the form when it is submitted. This is actually a URL, so it works similarly to an HREF tag. NetCloak Pro automatically registers the suffix .fdml with the web server, so all you need to do is specify the NetCloak FDML template document to use to process the form data. For example:

<FORM ACTION="MyFDML.fdml" METHOD=POST>

In this case, the ACTION attribute of the FORM tag tells the server to use the FDML template document MyFDML.fdml (located in the same directory with the form) to process the data.

Just like a hyperlink in an HREF tag, the ACTION can be specified with a relative path when the desired FDML is located on the same server as the form being accessed. In this case, either a relative or an absolute path may be used.

The form and FDML need not be located on the same server, in which case an absolute URL (including http:// and the server hostname) must be used. (There is a security option that restricts this by default- see the Configuring NetCloak section.) In either case the path to the FDML file is always relative to the location of the web server or site root folder. The following example uses the same syntax as above but with an absolute path, which would be used if the form were located on another web server:

<FORM ACTION="http://www.myserver.com/MyFDML.fdml" METHOD=POST>

You can also set up other file name suffixes for FDML templates; these need not be .fdml. This requires setting up an additional suffix mapping in your web server and checking the NetCloak security option. See the Configuring NetCloak section of the User's Guide.

The METHOD Attribute

There are two methods of sending form data from a Web browser to a server: GET and POST. NetCloak supports either method.

The GET method encodes the form data and appends it to the URL specified in the ACTION attribute as search arguments. Search arguments follow a question mark (?) character in the URL received by the server. Because URLs are limited to a length of 1024 characters, including the protocol, server name, file path, and search arguments, this limits the length of data that can be sent using the GET method. Ordinarily, HTML forms use the POST method.

Using the POST method, the encoded form data is sent in the content of the message sent from the browser to the server. All this means is that there is no limit to the length of data you can send using the POST method. However, NetCloak has a limit of 32Kb (32,768 characters) of data that can be received using the POST method.

In either case, you must specify the method you want to use in the METHOD attribute of the FORM tag, as in these examples:

<FORM ACTION="/MyFDML.fdml" METHOD=GET>

<FORM ACTION="/MyFDML.fdml" METHOD=POST>

Form Fields

To allow users to enter data into your form, you will also need some entry fields. There are various types of entry fields, most of which correspond to user-interface elements you are already familiar with from the dialog boxes on your computer.

Every form field tag must include a name attribute. Later, when creating FDML documents, fields must be referred to by name. Other attributes are particular to each field type, such as type, value or size. For most field types the type attribute is required, but others may be optional.

Text Box

A Text Box allows the user to enter a single line of text into the form. The optional SIZE attribute can be used to set the length, in characters, of the box that will be displayed; MAXLENGTH is the maximum number of characters that can be entered. The VALUE attribute can optionally be included to set a default value for the field which will appear without the user having entered anything.

<INPUT TYPE="text" NAME="myText" SIZE="30" MAXLENGTH="40" VALUE="default value">

Password Box

A password box is identical to a text box, except that the text entered by the user will appear as bullet characters (•). These are most commonly used for entering passwords or other sensitive information you wish to be obscured as it is entered. The password type allows the same options as the TEXT type.

<INPUT TYPE="password" NAME="mySecret" SIZE="30" MAXLENGTH="40" VALUE="default value">

Text Area

A text area field is similar to a text box, but can have multiple rows with scroll bars. The optional rows and cols attributes set the size of the text area in rows and columns. The optional wrap attribute allows you to specify automatic text wrapping. A value of hard or physical will automatically insert return characters when the end of a line is reached; a value of soft will wrap text at the end of the line without inserting return characters; and a value of none will not wrap text automatically. Default text for the text area may be specified by placing the default text in between the opening and closing TEXTAREA tags.

<TEXTAREA NAME="myText" ROWS=5 COLS=40>Default Text</TEXTAREA>

Checkbox

Displays a checkbox on the form. Checkboxes are normally used singly to allow the user to make a yes/no choice, or in a group to allow the user to select one or more of several options.

The required value attribute will be returned as the value of the field if the box is checked, otherwise nothing is returned. If the checked attribute is specified, the box will be checked by default.

<INPUT TYPE="checkbox" NAME="myCheck" CHECKED VALUE="box1">

Radio Buttons

<INPUT TYPE="radio" NAME="myButtons" CHECKED VALUE="button1">
<INPUT TYPE="radio" NAME="myButtons" VALUE="button2">

Displays a radio button into your form. Radio buttons are so named because they operate like the mechanical push buttons on old car radios- pushing one button in selects a particular station, and pushing a different button pops out the previous one. Radio buttons are normally used in a group to allow the user to select one and only one of several options.

The required value attribute will be returned as the value of the field if that button is selected. If none of the buttons are selected, nothing will be returned. To link several radio buttons, assign the same name but different values. If the checked attribute is specified, that button will be selected by default before the user has selected anything.

Pop-up Menu

<SELECT NAME="myPopup">
<OPTION VALUE="1">first
<OPTION VALUE="2" SELECTED>second
<OPTION VALUE="3">third
</SELECT>

Inserts a pop-up selection menu element into your form. Pop-up menus allow the user to select one and only one of several options, listing each option as text. Popup menus function similarly to radio buttons, but appear quite different.

An option which includes selected in the option tag will be selected by default. A value attribute may be specified inside each option tag. If a value is specified, the value will be returned when that field is selected. Otherwise, the text listed after the option tag will be returned when that option is selected.

Scrolling List

<SELECT MULTIPLE SIZE=3 NAME="myList">
<OPTION VALUE="1">first
<OPTION VALUE="2" SELECTED>second
<OPTION VALUE="3">third
<OPTION VALUE="4">fourth
</SELECT>

Adds a scrolling selection list to the form. A scrolling list has a vertical scroll bar, and lists each option allowing the user to scroll through and select one or more items. Just as a pop-up menu is analogous to a group of radio buttons, a scrolling list is analogous to a group of check boxes.

The optional size attribute sets the number of items that will be visible at the same time. In most browsers, the scroll bar will not be displayed correctly unless there are at least four items displayed. An option which includes selected in the option tag will be selected by default. A value attribute may also be specified inside each option tag to insert a value other than the text listed after the option tag.

Hidden Field

<INPUT TYPE="hidden" NAME="myInvisible" VALUE="you can't see this!">

Inserts a hidden field into your form. Hidden fields are submitted as part of the form, but the field and the information in it are not displayed by the browser.

Hidden fields are useful for including information in a form that you don't want the user to see, such as the filename from a previous form, or dynamic information inserted by NetCloak. Note that hidden fields are displayed to the user if they use the View Source command in the browser, so they should not be used for security or to hide sensitive information.

Submit Button

<INPUT TYPE="submit" NAME="Submit Form">

When the user is done entering information or making selections, they will need a button on the form to click to submit the form for processing. The optional name attribute can be used to specify the text on the button.


Copyright © 1996-2000 Maxum Development Corporation

http://www.maxum.com/
Previous | Next
Contents