text_field Using the PI, you can define the size of the field by specifying the character width and maximum number of characters the field will hold. If you select password, the input display will only show asterisk characters. This does NOT function as a password protected site, it merely offers visual protection. Contact your server admin for info on securing and/or encrypting data for password protection.
The textfield will be empty to users until they input text *unless* you put an Init val (initial value) in the PI at authoring time. An initial value will be text that is displayed to the user when the page loads. Usually this text is instructional text or a prompt telling the user what you want them to do, and the user will select and type over the text. I recommend not using Init val for a textfield since users many not realize that you want to collect input data from them and they may skip over a field that is already populated with text.
If you disagree and can give examples of times when Init val may be helpful to the user...
Hidden fields are invisible in the html page but viewable in the source of the HTML document. You can put your hidden fields anywhere in your form but the standard location is at the beginning of the form. It's helpful to add a comment describing the purpose of the field. You can add comments to your document by going to the Common Panel of the Insert Bar and using the Comment Button.
text_area
Compare the PI for this Textarea to the PI for the Text Field. The main difference is that the Type radio button is set to "Multi line" and the Wrap dropdown menu is available in the Textarea. I set my Wrap to virtual. The Wrap menu options are:
Default, which is the browser default;
Off, which stop text from wrapping and creates one long line of text;
Virtual which wraps in the browser but text doesn't wrap when it's submitted to the server;
Physical which wraps in the browser and text does wrap when it's submitted to the server.
You can toggle the Type radio set of buttons to convert a Multi line Textarea into a Single line Text Field and/or Password and vice versa.
Type several lines into the Textarea on the left to see what happens when the box "overflows".
check_box
Checkboxes come in groups, and you must supply the group's name along with a label and value for each checkbox. Use the PI to enter the group name -- in the example below, the group name is "hobbies". Use the Checked value text field to enter the value the form will report when that individual box is checked. Note that the checkbox label and value can be identical.
the checkbox name must be the same for all checkboxes within one group.
each check box value must be unique within the checkbox group
all checkboxes are unchecked by default
a user can select multiple check boxes
radio_button
Radio buttons come in groups, and you must supply the group's name along with a label and value for each radio button. Use the PI to enter the group name -- in the example below, the group name is "hobbies". Use the Checked value text field to enter the value the form will report when that individual button is selected. Note that the radio button label and value can be identical.
the radio button name must be the same for all radio buttons within one group: e.g. "age"
each check box value must be unique within the checkbox group
only one radio button can be selected for each group of radio buttons - think of a car radio button, when you select one, the other station goes off. YOU CAN ONLY HAVE ONE SELECTION WITH RADIO BUTTONS. Test yours before submitting. GET THIS RIGHT !
The name of the button group goes in the textfield below on the left, below the Radio Button text. The default says "radiobutton". This is the name that will be the same for all the radio buttons of a given SET or GROUP. The Checked value is the descriptive name you assign to each button within a set, for example if your Radio Button set were named Gender, your Checked values for two buttons in the group could be Male and Female.
The Radio Group button was added to DW MX2004 to make it easier to create sets of radio buttons. Selecting the Radio Group icon and then filling in the Labels and Values in the radio group pop-up box should make it easy for you to get your Radio buttons right!
list_menu
The Dropdown List and Dropdown Menu share a PI. Use the radio buttons on the PI to select the element you wish to use. A Dropdown list will allow multiple selections from its list - the user can shift+click or control+click to select more than one option. The list will scroll if you have more items than the number you enter for the height of the list.
A Dropdown Menu allows only one selection from its values.
Click on the "List Values... " button to enter or edit elements in your list/menu.
Use the tab key to add new Item Labels and Values. The Labels appear to the viewer in the list and the Values are submitted and parsed by the form handler. Notice that the Value can be the same word as the label. If the Value is the same word or a different word than the Item Label, it should be descriptive.
Add items with the + and delete items with the -. Use the triangular arrows on the right to reorder the list items.
jump_menu
Details of the Jump Menu are listed later in this lesson. You will submit a Jump Menu for this week's homework. Please make sure that the Jump Menu is on a different .html page than the form that you will submit for this week's homework.
image_field Selecting the Image Field Button will open the Select Image Source dialog box where you can browser for an image to insert as a submit button.
file_field (I disabled this for safety, so it doesn't show!)
I recommend that you NOT use this one your form. Anyone can upload a file with a virus attached and/or you may get spammed with files you don't want and didn't request. Use with caution.
button
The button icon allows you to create the Submit and Reset buttons for your form. Use the PI to choose which button to create, and to change the button value -- the text which appears on the button.
I recommend always putting the Submit button before the Reset or Clear button. The reason is that users tend to use the Tab key on their keyboard to move to the next input area or form element. This is called setting the focus in a form field. The default order will set the focus on whichever button is closest to the top of the form. If a user is tabbing through and comes to the reset button, they might accidentally click and erase all their input.
You can set the tab order by using the Tab Index field of the Input Tag Accessibility Attributes Window. To open this window, go to your Preferences and select the Accessibilities category. Check the Form Objects box.
The None button can be used with scripts to perform calculations such as a script to return the sum of numbers.
field_set The fieldset button creates 2 container tags; a fieldset and legend as follows:
"The FIELDSET element defines a form control group. By grouping related form controls, authors can divide a form into smaller, more manageable parts, improving the usability disaster that can strike when confronting users with too many form controls. The grouping provided by FIELDSET also helps the accessibility of forms to those using aural browsers by allowing these users to more easily orient themselves when filling in a large form."
DW will automatically divide your Document Window into Split view when you select the fieldset button.
The fieldset is a new HTML4.0 element and you can read more about it here - the source of the above quote:http://www.htmlhelp.com/reference/html40/forms/fieldset.html
label
The label button lets you associate a text label for a field with the fieldset.
Jump Menu
This icon was installed by Project VII, when the Project VII Jump Menu extension was downloaded. See information about this Jump Menu later in the tutorial.
