Inserting and editing form controls
Types of form controls
One-Line Text Box
Lets users enter brief text, such as a name or one line of a street address. If the user leaves the text box empty, its name will still be sent to the form handler, but without a value. Text boxes of the special password subtype displays asterisks in place of the typed characters.
Examples: |
|
Scrolling Text Box
Lets users enter long text with multiple paragraphs, such as a comment or the body of an e-mail message. If the user leaves the text box empty, its name will still be sent to the form handler, but without a value. You can specify the number of lines the text box will display at a time.
Example: |
|
Check Box
Lets users answer a yes/no question by checking or unchecking a box. If the user does not check the box, no name or value will be sent to the form handler. You can control whether the check box is initially checked or unchecked.
Examples: |
Send me spam. |
Radio Button
Lets users select one choice from two or more mutually exclusive choices. Radio buttons should always exist in groups of at least two. When the user selects a button, the button that was previously selected becomes deselected. Each button in the same group should have the same name. You can control whether each radio button is initially selected or not, but only one button in a group should be initially selected.
Examples: |
Send me spam. |
Drop-Down Menu or List Box
Lets users select one item or, optionally, multiple items from a list presented as either a drop-down menu or a list box. For each item the user selects, the name of the control and the value of the item will be sent to the form handler. If the user selects no item, no name or value will be sent. You can specify the height of the control (in rows) and whether multiple selections are allowed. Setting the height to 1 produces a drop-down menu; setting it to 2 or greater produces a list box.
Examples: |
Australia Brazil Canada France Japan Madagascar |
Australia Brazil Canada France Japan Madagascar |
Push Button
A standard button that performs some action when clicked. The appearance of a push button depends on the browser and the operating system; generally, it looks the same as a button in a dialog box. There are three kinds of push buttons:
- submit: Sends the form data to the form handler.
- reset: Clears the form, returning it to its initial state.
- general: No predefined function. To make a general button do something, you need to attach a script action to it.
Examples: |
Image Control
An image that acts as a submit button, sending the form data to the form handler when clicked. Included in the form data are the x and y coordinates of the point the user clicked on the image. Thus, the form handler could do different things depending on where the user clicked on the image.
Example: |
Hidden Field
Provides a way to include information in the form data while keeping it invisible to users. The name and value of the hidden field are always included in the form data, even though the user cannot interact with the hidden field. Among other things, a hidden field could be used to provide the form handler with the URL of the page from which the form data was sent (and the form handler could do something different depending on that information). In Edit mode, hidden fields are indicated with this icon: . (If you cannot see hidden field icons, click (Show/Hide Special Tag Marks) on the Standard Toolbar.)
File Browser
Same as a one-line text box, but with a “Browse” button attached. If the user clicks the Browse button, he or she can select a file on the local file systemThe collection of drives and network folders connected to your computer., and its absolute path will be automatically entered in the text box. (The user can still type arbitrary text in the box, however.) Useful for forms where the user is asked to specify a file to be uploaded to a server.
Example: |
To insert a one-line text box
- Place the insertion point where you want the one-line text box.
- Do one of the following:
- On the Insert menu, point to Form, and then click One-Line Text Box.
- On the Form Toolbar, click (Insert One-Line Text Box).
- (optional) Modify the default settings as desired:
- In the Name box, edit or replace the default name assigned by Namo WebEditor. Do not use the same name as any other control on the form.
- In the Initial value box, enter the text that will initially appear in the box.
- In the Width in characters box, enter the width of the box in characters.
- In the Maximum input length box, enter the maximum number of characters that will be accepted.
- Set Input type to Password if the text box will be used for password entry. (Typed characters will be displayed as asterisks.)
- Click OK.
To insert a file browser
- Place the insertion point where you want the file browser.
- Do one of the following:
- On the Insert menu, point to Form, and then click File Browser.
- On the Form Toolbar, click (Insert File Browser).
- (optional) Modify the default settings as desired:
- In the Name box, edit or replace the default name assigned by Namo WebEditor. Do not use the same name as any other control on the form.
- In the Width box, enter the width of the box in characters.
- Click OK.
To insert a scrolling text box
- Place the insertion point where you want the scrolling text box.
- Do one of the following:
- On the Insert menu, point to Form, and then click Scrolling Text Box.
- On the Form Toolbar, click (Insert Scrolling Text Box).
- (optional) Modify the default settings as desired:
- In the Name box, edit or replace the default name assigned by Namo WebEditor. Do not use the same name as any other control on the form.
- In the Initial value box, enter the text that will initially appear in the box.
- In the Width box, enter the width of the box in characters.
- In the Number of lines box, enter the height of the box in rows of text.
- Click OK.
To change the scroll bars on a scrolling text box
- After inserting a scrolling text box, double-click it.
- Click Scroll Bar.
- Specify the scroll bar colors as described in “Setting document scrollbar colors“.
- Click OK twice.
To insert a check box
- Place the insertion point where you want the check box.
- Do one of the following:
- On the Insert menu, point to Form, and then click Check Box.
- On the Form Toolbar, click (Insert Check Box).
- (optional) Modify the default settings as desired:
- In the Name box, edit or replace the default name assigned by Namo WebEditor. Do not use the same name as any other control on the form.
- In the Value box, enter the value that will be sent to the form handler if the user checks the box. (If you do not specify a value, the browser will send “On”.)
- Set Initial state to Checked if you want the check box to be initially checked.
- Click OK.
- Type a label for the check box.
To insert a radio button group
- Repeat the steps below for each radio button in the group:
- Place the insertion point where you want the radio button.
- On the Form Toolbar, click (Insert Radio Button).
- Make sure the name in the Name box is the same as that of every other button in the group, and different from that of any other control on the form.
- In the Value box, enter the value that you want associated with the current button.
- Set Initial state to Selected or Not selected. (Only one button in the group should be initially selected.)
- Click OK.
- Type a label for the button.
To insert a drop-down menu or list box
- Place the insertion point where you want the drop-down menu or list box.
- Do one of the following:
- On the Insert menu, point to Form, and then click Drop-Down Menu.
- On the Form Toolbar, click (Insert Drop-Down Menu).
- (optional) In the Name box, edit or replace the default name assigned by Namo WebEditor. Do not use the same name as any other control on the form.
- Repeat the steps below for each item you want in the menu or list.
- Click Add.
- In the Name box, enter the name of the item as you want it to appear in the menu or list.
- In the Value box, enter the value that you want associated with the item.
- If you want the item to be initially selected, select
the Selected check box. - Click OK.
- In the Height box, enter the desired height of the control in rows. If you enter 1, the control will display as a drop-down menu; if you enter 2 or greater, it will appear as a list box in which the specified number of rows is visible at a time.
- If you want the user to be able to select more than one item, select the Allow multiple selections check box.
- Click OK.
To insert a push button
- Place the insertion point where you want the push button.
- Do one of the following:
- On the Insert menu, point to Form, and then click Push Button.
- On the Form Toolbar, click (Insert Push Button).
- (optional) In the Name box, edit or replace the default name assigned by Namo WebEditor. Do not use the same name as any other control on the form.
- In the Value box, enter the value associated with the button. The value also serves as the button’s label (the text that appears on the button).
- Set the Button type to:
- Submit, for a button that sends the form data to the form handler
- Reset, for a button that clears the form, resetting it to its initial state
- General, if you intend to attach a script action to the button and only want the button to trigger that action.
- Click OK.
To insert an image control
- Place the insertion point where you want the image control.
- Do one of the following:
- On the Insert menu, point to Form, and then click Image Control.
- On the Form Toolbar, click (Insert Image Control).
- (optional) In the Name box, edit or replace the default name assigned by Namo WebEditor. Do not use the same name as any other control on the form.
- In the Image box, type the path or URL to an image file, or do one of the following:
- Click (Browse) to find and select an image file on your local file systemThe collection of drives and network folders connected to your computer..
- Click (Clip Art) to select an image from the clip art library.
- Click (Site) to select from a list of image files belonging to the current local site (if one is open).
- (optional) Under Size and Layout, specify the image properties as desired. (The options are the same as those available when inserting an ordinary image; see “Images” for more information.)
- Click OK.
To insert a hidden field
- Place the insertion point where you want the hidden field. (Since it is hidden, its location does not matter, as long as it is within the form.)
- Do one of the following:
- On the Insert menu, point to Form, and then click Hidden Field.
- On the Form Toolbar, click (Insert Hidden Field).
- (optional) In the Name box, edit or replace the default name assigned by Namo WebEditor. Do not use the same name as any other control on the form.
- In the Value box, enter the value to be sent to the form handler.
- Click OK.
To edit a form control
- Double-click the form control.
Changing the appearance of a form control
You can control many aspects of the appearance of most form controls. For example, you can change the character formatting (font, text color, and so forth) of a one-line text box, or the border properties of a button. To change the appearance of a form control, do this:
- Double-click the form control.
- Click the Style button and then click:
- Character, to change character-related properties, such as font
- Paragraph, to change paragraph-level properties, such as text alignment, line height, and so forth
- Borders & Background, to change the control’s borders, margins, padding, and background color or image.
For more information about using style properties, see the following topics:
- Setting character-related properties
- Setting paragraph alignment, indentation, and line height
- Setting margins, padding, and borders
- Setting background colors and images
Note that not all control types are affected by a given style property. For instance, specifying the font for a check box or radio button has no effect, since those controls cannot contain text. (You can, of course, apply a style to a check box’s label as you can to any other text, but the label is separate from the check box.)