Building a survey form using Dreamweaver Activity 2 Procedure 1. Start Dreamweaver and create a new...
-
Upload
joleen-strickland -
Category
Documents
-
view
219 -
download
1
Transcript of Building a survey form using Dreamweaver Activity 2 Procedure 1. Start Dreamweaver and create a new...
Building a survey form using Dreamweaver
Activity 2
Procedure1. Start Dreamweaver and create a new web page and
name it forms.html.2. In the ‘Forms’ Insert bar, click the ‘Form’ button to
insert a form. A rectangle of red dotted lines should be displayed.
Activity 2
3. Enter the following settings in the Properties Inspector.
Form name: surveyAction: mailto:[email protected]: POSTEnctype: text/plain
Building a survey form using Dreamweaver
Form
Activity 2
4. Click the form region and the ‘Text field’ button . Enter the following settings.
Label: NameField name: NameChar width: 30
Building a survey form using Dreamweaver
Text fieldLabel
Activity 2
5. Enter ‘Sex:’ for the next label. Click the ‘Radio button’ to insert two radio buttons. Adjust the settings as follows.
Radio button 1: Label: M Radio button 2: Label: FField name: sex
Field name: sexChecked value: M
Checked value: FInitial state: Checked
Initial state: Unchecked
Building a survey form using Dreamweaver
Activity 2
6. Enter the text ‘Are you satisfied with this web site?’ and click the ‘Menu’ button to insert a menu. Adjust the settings as follows.Field name: likeType: Menu
Building a survey form using Dreamweaver
Activity 2
7. Click the button in the Properties Inspector and enter the following values.
Building a survey form using Dreamweaver
Item label Value
Please select –
Excellent 5
Good 4
Fair 3
Unsatisfactory
2
Poor 1
Activity 2
8. Enter the text ‘Where do you know this web site from?’. Click the ‘Checkbox’ button to insert four check boxes with the following settings.
Building a survey form using Dreamweaver
Check box 1
Check box 2
Check box 3
Check box 4
Field name
Hear Hear Hear Hear
Label Internet Newspaper TV Radio
Initial state
Unchecked Unchecked Unchecked Unchecked
Checked value
Internet Newspaper TV Radio
Activity 2
Building a survey form using Dreamweaver
Activity 2
9. Enter the text ‘Please fill in your comments here.’ and click the ‘Textarea’ button . Make the following settings.Field name: commentChar width: 50Num lines: 3
Building a survey form using Dreamweaver
Activity 2
10. Click ‘Button’ to insert the ‘Submit’ and ‘Reset’ buttons in the form as follows.
Building a survey form using Dreamweaver
‘Submit’ button
‘Reset’ button
Field name
Submit Reset
Label Submit Reset
Action Submit form Reset form
Activity 2
11. Make sure all input elements are placed within the form region.
12. Switch to the Code view to check the HTML tags generated by Dreamweaver.
Building a survey form using Dreamweaver
Activity 2
13. Save the file and preview it in a browser.14. Make sure your e-mail software has been properly
installed. Enter some information onto the form and click the ‘Submit’ button.
15. Log on to your e-mail account (the one specified in the action attribute) and check the form data. An example is shown below.
Building a survey form using Dreamweaver
Activity 2
13. Save the file and preview it in a browser.14. Make sure your e-mail software has been properly
installed. Enter some information onto the form and click the ‘Submit’ button.
15. Log on to your e-mail account (the one specified in the action attribute) and check the form data. An example is shown below.
Building a survey form using Dreamweaver