Starting BBEdit or Notepad and Opening the HTML File

Starting BBEdit or Notepad and Opening the HTML File

• Start BBEdit or Notepad

• Select Open from the File Menu

• Open survey1.htm from the Public Folder

survey1.htmsurvey1.htm

text-basedquestionnaire

Identifying the Form ProcessIdentifying the Form Process

• <FORM> attributes METHOD: Specifies the manner in which the

form is sent to the server• The GET method sends the name-value pairs to

the end of the URL indicated in the ACTION attribute• The POST method sends a separate data file to

the URL This project will utilize the POST method

Identifying the Form ProcessIdentifying the Form Process

• <FORM> attributes ACTION: specifies the action that will be

taken when the form is submitted• Information can be sent by e-mail to a central e-

mail address• Information can be sent to the Web server for

processing• Web sites can process information from forms

using Common Gateway Interface (CGI) scripting

Identifying the Form ProcessIdentifying the Form Process

<FORM METHOD=POST ACTION=“mailto:ahs@isp.com”>

determines how data is sent

action to be takenwhen submitted

Identifying the Form ProcessIdentifying the Form Process

• Click line 9 and press the ENTER key

• Type <FORM METHOD=POST ACTION=“mailto:ahs@isp.com”> and press the ENTER key

• Click the blank line just above the </BODY> tag (line 26) and press the ENTER key

• Type </FORM> as the end tag

Identifying the Form ProcessIdentifying the Form Process

Changing the Text MessageChanging the Text Message

• Select lines 14 and 15 and then press the DELETE key• With the insertion point on line 14, type and send your responses to the Reunion committee by using the Submit button below as the new text• Highlight lines 17 through 21 and then

press the DELETE key

Changing the Text MessageChanging the Text Message

unnecessarytext deleted

Adding Radio ButtonsAdding Radio Buttons

• Add two sets of radio buttons to allow the visitor to select only one option from a list of options

• Visitors can select only one item per group Radio buttons that have the same name

belong to the same group

Adding Radio ButtonsAdding Radio Buttons

field name control typevalue of field if

“Yes” is selected

Field name –must be the samefor radio buttons

value of field if“No” is selected

Adding Radio ButtonsAdding Radio Buttons

• Add the following HTML, starting on line 17

Adding Radio ButtonsAdding Radio Buttons

inserted code

Adding a Text FieldAdding a Text Field

control typefield name

Number ofcharacters that

display on Web page

maximum numberof characters that

can be input

Adding a Text FieldAdding a Text FieldAdd the outlined HTML starting

on line 24. Press the ENTERkey twice after the </P> tag

Adding TextareasAdding Textareas

start textarea field namenumberof rows

numberof columns

endtextarea

Adding TextareasAdding Textareas

• Add the following HTML, starting on line 27

Adding TextareasAdding Textareas

inserted code

Submit and Reset ButtonsSubmit and Reset Buttons

control type

text todisplay on

Submit button

control type text todisplay on

Reset button

Submit and Reset ButtonSubmit and Reset Button

• If you specify an e-mail address in the ACTION attribute of the FORM tag, a file like this will be sent to the specified e-mail address