Creating a Form with NetCloak

See also How to Publish Web Pages on the Psychology HOMEPAGE Server

You may copy templates from these locations:

http://homepage.psy.utexas.edu/homepage/Publishing/FORMS_TEMPLATES/Download/

http://homepage.psy.utexas.edu/homepage/Publishing/FORMS_TEMPLATES/simpleform/

The following links consist of templates pages to be used for constructing questionaires consisting of 2 or more web pages. The data will be placed under the same unique # so that each respondent's answers will all reside on the same string when viewed in the data.txt file:

http://homepage.psy.utexas.edu/homepage/Publishing/FORMS_TEMPLATES/2forms1datafile/

http://homepage.psy.utexas.edu/homepage/Publishing/FORMS_TEMPLATES/3forms1datafile/

Note: Remove the ".hqx" suffix before opening the templates in the "Download" directory. Also, you will have to remove the "_x" from some of the html files in the Forms_Templates directory as well.

If you have access to the HomePage server you will be able to create forms that allow users to enter data, which will then be processed by NetCloak and sent to a tab-delimited text file. You can then import this text into a database or spreadsheet program. And you don't have to be a computer programmer to do it!

You will create 4 files which are necessary for this to work. They should all reside in the same folder/directory.

  • An HTML document

  • An FDML text document (this is just a plain text file)

  • An HTML response page

  • If you choose to use the "verify" tags you will have to create a "verify.html" page that will tell the participant they have left a field blank and will have to go back to complete the form.

Every form has "input fields" into which users will enter data. Each input field, whether it is a single-line text entry field, a check box, or a radio button, will have a "field name" with which it is associated. The bold text you see in the FDML example to the right are field names. Be sure to name your input fields with names you can easily remember, since you will refer to them by name when you create NetForms FDML documents. You must also make sure the names match up in the html and fdml document--they are case-sensitive. If just one character is wrong, the form will not work.

Below are some examples of HTML form fields that you can use in creating a form. Look at the corresponding FDML file (template.fdml) to see how the field names are entered and view the HTML code for this form (template.htm) to see the same field names in the <input type> tags. This will help you see how the two forms are connected. The FDML file takes the information from the <form> tags and <input type> tags and NETFORMS processes the information, sending the data to a tab-delimited text file that will be created in the same folder/directory as your HTM and FDML files, or in its own subfolder.

The FDML Page

Here is the text for the FDML document that corresponds to this page. It's called "template.fdml". It is a simple text file that you can create with any text editor.

<RESPONSE>"response.html"</RESPONSE>
<TEXTSTORE>"store/data.text"</TEXTSTORE>
<VERIFY FirstName LastName IDNumber Q1 Q2 Q3>verify.html</VERIFY>
+<UNIQUE>
+<DATE> @ <TIME>
FirstName
LastName
IDNumber
Q1
Q2let
Q2tom
Q2mus
Q3

(Note: Items in bold type--FirstName, LastName, IDNumber, Q1, Q2, Q2let, Q2tom, Q2mus and Q3-- are all "field names")

To see the response.html, template.fdml, and data.txt pages click on the links below.

response.html

template.fdml

data.text

Keep in mind that you can view the HTML code for these docs by selecting View Source in your browser menu.

EXAMPLES OF FORM TAGS

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.

You will have to insert the forms tags in the HTML code. It will go AFTER the <HEAD></HEAD> tags near the top of the page.

For this form the tag will look like this:

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

You can call the FDML file whatever you want, but for simplicity's sake, just give it the same name as the HTM form it corresponds to. If your form name is SURVEY.HTM, call the FDML file SURVEY.FDML. Also, it is important to remember that the HTM file and its corresponding FDML file MUST be in the same folder.


TEXT BOXES

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.

First Name:

Last Name:

ID Number:

First Name: <input type="text" name="FirstName" size="50">
Last Name: <input type="text" name="LastName" size="50">
ID Number: <input type="text" name="IDNumber" size="10" maxlength="5">

RADIO BUTTONS

Displays a radio button into your form. Radio buttons are so named because they operate like the mechanical pushbuttons 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.

1. Which is your favorite meal of the day? (Choose one)

Breakfast Lunch Dinner

Breakfast<input type="radio" name="Q1" value="Breakfast">
Lunch<input type="radio" name="Q1" value="Lunch">
Dinner<input type="radio" name="Q1" value="Dinner">

CHECK BOXES

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.

2. What do you like to put on your burgers? (Check all that apply)

Lettuce Tomato Mustard

<input type="checkbox" name="Q2let" value="Lettuce">Lettuce
<input type="checkbox" name="Q2tom" value="Tomato">Tomato
<input type="checkbox" name="Q2mus" value="Mustard">Mustard

POP-UP MENU

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.

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.

3. What do you like to drink with a meal?

<select name="Q3">
<option value="Milk" >Milk
<option value="Water">Water
<option value="Soda">Soda
<option value="Tea">Tea
<option value="Coffee">Coffee
<option value="None of the Above">None of the Above
</SELECT>