|
Step by step exercise . Unit 9. Inserting elements in an interactive form |
|
Objective |
|
To Practice certain operations used to insert and configure some form elements. |
| 1 You need to open Dreamweaver in order to perform the exercise. 2 If the Files panel doesn't show up, open it through Window menu and then the Files option. 3 Select the Animals site in the Files panel. 4 Double-click on the consults.htm file in the Files panel. The document will be opened in Dreamweaver. 5 If the properties inspector doesn't show up, open it through Window menu and then Properties option. 6 If the properties
inspector is not completely shown, click on the 7 It's not necessary to insert the form since it is already created. Inside there is a table. Place the mouse inside the first row's last cell. 9 Select the Form option. 10 Select the Text Field option. 11 Click on it to select. 12 In the Text Field of the properties inspector - write name. 13 In Max Chars - write 15. 14 In Type - select Single line . 15 Place the mouse inside the second row last cell. 16 Repeat steps from 8 to 14 but with the following differences: In Text field - write email. In Max Chars - write 25. 17 Place the mouse in the last cell of the third row. 18 Click on the Insert menu. 19 Select the Form option. 20 Select the List /Menu option. 21 Click on the List/Menu object to select it. 22 In the List/menu of the properties inspector, write animals. 23 In Type - select Menu. 24 Click on List Values button. 25 Write ---Choose an option--- in Item label. 26 Click on the 27 Click on the OK button. 28 Select---Choose a option--- on Initially selected. 29 Place the mouse on the fourth row of the last row. 30 Click on the Insert menu. 31 Select the Form option. 32 Select the Text area option. 33 Click on the text area to select it. 34 Write consult in the Text field of the properties inspector 35 In Type - select Multi line . 36 In Char width - write 50. 37 In Num Lines - write 10. 38 In Init val type Write your consult here. 39 Place the mouse in the blank line under the table, inside the form. 40 Click on the Insert menu. 41 Select the Form option. 42 Select the Button option. 43 Click on the button to select it. 44 In the label option of the properties inspector, write Clear. 45 In Action select Reset form. 46 Place the mouse at the right of the button. 47 Repeat steps from 40 to 45, but with the following differences: In Label - write Send. In Action - select Submit form . 48 Click on the Save 49 Now you can try the form elements, open the file in your browser and fill the fields. If you click send, nothing happens because we don't have any code associated to the send button. |
| |
|
Legal
warning: Authorised on-line use only. It is not allowed the use
of these courses in companies or private teaching centres.
|