line
Creating a form
line

Forms include such things as questionnaires and order forms, in which visitors to your Web site fill in blanks and enter responses to multiple choices within the form. This section discusses how to create a form for a questionnaire.

This section contains the following topics:

Related HTML tags <FORM></FORM>
<INPUT TYPE= >
<TEXTAREA>
<SELECT></SELECT>


Note Note Before doing this task, check that your provider permits the use of forms and CGI programs. If it does not, you cannot use forms even if you create them.

You can check that your form operates correctly only after you upload your Web page that contains your form to your provider's server.


Note Note TopPage does not provide a function for creating CGI programs. It is recommend that you use CGI programs offered by your provider.



Creating an area for your form

First, you must create an area only for your form in your Web page. To create the area, position the cursor on the location where you want to create your form. Select Form and Input Fields from the Insert menu, and then select Form to create an area for your form. (The form area is indicated by a dotted line, but the line is not displayed on Web browsers. If you insert anything in the area, the area expands.)

Edit field with a form inserted


Using a table for layout

To create a table within the form area to lay out input fields:

  1. Click inside the form area, and click the Create table icon icon.

  2. In the Insert Table dialog box, type the number of rows and columns, and click the OK button to create a table inside the form area.

  3. If you want to use only the layout of the table, you do not need the table border. Click the table using the right mouse button, and select Hide Table Frame from the pop-up menu.

    Table


Types of input fields

Before inserting input fields, become acquainted with the types of input fields.

Type of input field Explanation Toolbar icon Example
Check box Visitors can click to select or clear this check box on their Web browsers. Check box icon Display example
Radio button Visitors can choose one radio button from those of the same group. Radio button icon Display example
Submit button Visitors can click this button to upload the information they entered to the CGI program on your provider's server. Submit button icon Display icon
Reset button Visitors can click this button to return the information they entered to the initially set value. Reset button icon Display example
Option menu Visitors can select one of multiple choices. Option menu icon Display example
List box Visitors can select one of multiple choices. List box icon Display example
Text field Visitors can type one line of text in this field. Text field icon Display example
Text area Visitors can type multiple lines of text in this area. Text area icon Display example


Tip Tip Other input fields

Frequently used input fields are on the toolbar, but you can insert all the input fields from the menu. By selecting Input Fields from the Inset menu, you can insert input fields other than those described in the preceding table. They are:
  • Image Button (a button with an image)
  • Button (a button for general purposes)
  • Extended Button (a button generated by the selection of its range, displayable only on Internet Explorer 4.0 or later.)



Inserting input fields

To insert input fields in a table for layout:

  1. Position the cursor on the location where you want to insert an input field. Click one of input field icons on the toolbar to display the Attribute dialog box for the input field. [Ref.] "Types of input fields"

    Tip Tip If the Attribute dialog box is not displayed, select Options from the Tool menu, and select the Open Attribute Dialog after Creating an Object check box.

    Tip Tip To change attributes for input fields later, click the field using the right mouse button, and select Attributes from the pop-up menu.

  2. Type the input field name under Name. To specify other items, click the Help button on the dialog box to display the help topic that explains how to specify items.

    Note Note The input field name that you must enter under Name is used as an identification code in the CGI program. If you use your provider's CGI program, type the name that the provider prescribes.

  3. Repeat the preceding steps to complete the questionnaire.

  4. Position the cursor on the bottom of the questionnaire, and click the Submit button icon to display the Attribute dialog box for a submit button.

  5. Enter "Submit" under Label, and click the OK button to create a submit button.

    Attribute dialog box

  6. Position the cursor to the right side of the created submit button, and click the Reset button icon icon to display the Attribute dialog box for a reset button.

  7. Enter "Reset" under Label, and click the OK button to create a reset button.

    Attribute dialog box

    The following example shows how a form appears in the editor:

    Questionnaire

    The following example shows how the same form appears when viewed on a Web browser:

    Display example on a Web browser


Specifying a CGI program

If your provider permits the use of forms, it provides guidelines for specifying the CGI program name, form attributes, and so on. (If it does not, ask your provider.)

Note Notes This User's Guide does not provide details about specifying these items, because the specification varies depending on the providers.

You can check that your form operates correctly only after you upload your Web page that contains your form to your provider's server.


  1. Click inside the form using the right mouse button, and select Attributes from the pop-up menu to display the Attribute dialog box for a form.

    Attribute dialog box

  2. Specify the items according to the provider's guidelines. If you do not understand the meaning of any item, click the Help button to display the help topic.

  3. Click the OK button.