24th Section Form

The role of a form is to enable visitors to interact with a site or site administrator. Using forms, you can automatically generate page feedback to visitors based on the information they enter, and use the form to collect information that visitors enter for the site. The use of forms can actually be divided into two parts. Part of the form itself is how to add the form as a page element to the page. The other part is the processing of the form, that is, invoking a server-side script or sending it in an e-mail message. This section is mainly about how to add a form to a page.

Click the Form button above the objects panel to eject a marquee. Click Head, then the objects panel switches to form mode.

The following figure is an example of a form creation. This section will specifically analyze this example to illustrate the production of the form.



Obviously, this form consists of two text boxes and a text field.

Here is the production step. First switch objects panel to Forms mode, click on the icon and draw a form area on the Dreamweaver main window. Click on the red border of the form area to select this form. At this point, the form's proprties panel is shown in the following illustration.

(Form's proprties panel)

In the Properties panel, under Form name, fill in the name of the form. Here, we fill in a. The action is to set the address of your corresponding server-side script, or set up email to the designated mailbox.
method to set how the form is submitted, typically by selecting post in the next Drop-down selection box. The overall properties of the form are set.

Enter the text "your email:" and set its properties such as size, color, and so on. Click the icon on the forms mode of the objects panel, where a text box appears on the Dreamweaver main window. Select the text box and the properties panel of the text box is shown in the following illustration.
(proprties Panel of text box)

　

Under TextField in the text box propertis panel, fill in the name of the text box. Here, we fill in a. Sets the width of the text box after the char width. Here, we can set to 20. Max chars is the maximum number of characters to set the text box to enter, and Init Val fills in the initial text when the text box is displayed. We can not set these two items. The text box for the visitor to enter the email is set.


Press Shift+enter to change lines, and then enter the text "Your homepage:" and set its size, color and other attributes. At this point, set the text box for the visitor to enter the URL. This text box, in addition to naming, sets the method ibid.


Press Shift+enter to wrap, then enter text "Introduction:" and set its size, color and other properties. Click the icon on the forms mode of the objects panel, where a text box appears on the Dreamweaver main window. Select the text box to convert the text box to a text field by selecting the box on the properties panel of the text box after the type multi line. At this point, the Properties panel of the text field is shown in the following illustration.


(The proprties panel of the text field) fills in the name of the text field under the TextField of the Text field Properties panel. Here, we can fill in E. Sets the width of the text field after the char width. Here, we can set to 20. Sets the number of lines that this text field occupies after num lines. Here, we can set to 5. Wrap is the way to set the text line, you can choose Default. Init Val is the initial text that is set when the text field is displayed, which is not filled in. The text field is set up.


Press the Shift+enter key to wrap the line. Click the icon on the forms mode of the objects panel, where a button appears on the Dreamweaver main window. Select this button and the Properties panel of the button can be found in the figure below.

(Button's proprties panel), under button name of the Buttons properties panel, fill in the name of the button. Here, we can fill in F. We want this button to act as a form, so select Submit form after the action. Lable is the text that is set to display this button. Here, we fill in "confirmation".
Next, set the second button. Here, set this button named G, after the action select Reset form, after lable set this button to display the text as an override. Two buttons are also set.


Finally, you can set up validation of the form. Require visitors to fill in the URL, must have content, when filling in the mail address, the content must contain the symbol @.

Click the Window\behavior on the menu bar, or use the shortcut key F8 to eject the Behavior panel. Click on the + button on the panel and click on the Validate Form on the pop-up menu to pop up a dialog box.

In the front, this form is named a. We name a text box that asks the visitor to fill in the email, so the text box corresponds to TextField A in form a in the Validate Form dialog box. The text box that asks the visitor to fill in the URL is named B, so the text box in the Validate Form dialog box corresponds to TextField b in form a. Select TextField A in Form A and select the box between value and required, and then select the email address that follows accept. Select TextField B in Form A, and then select the marquee between value and required.