Introduction to Forms in HTML WebPages Mrs. Mustoe
What are they? to gather feedback or other information from our clients Setup is simple Retrieving data requires some programming and skill
General Setup Can be used anywhere in the body of a webpage ACTION – tells browser where to send the data to URL – webpage that contains the program that processes the data METHOD- how to send the forms data –Two options POST and GET –Dreamweaver defaults to POST –However – if outside links do not work – try GET
In Dreamweaver Be sure to change the view to Classic View Click on Forms Tab –Choose the New form button FIRST –Creates a red dotted line on your Design View –ONE and ONE needed PER Submit button –More on this in a minute
SUBMIT BUTTON Must be within a tag SUBMIT = control button for user to click VALUE = what the button says For example – watch the Online Lesson #1
RESET BUTTON Submit may also be used as a reset button for form controls Change the ACTION to RESET in your properties panel Or For Example – Watch online Lesson #1
Text Boxes for Single-Line Text Or –Field Name is the unique name given to this text box –In this case, it is the First Name that is tracked –Designed for one word responses only –For Example – Watch online Lesson #1
Bells and Whistles for Text Boxes Setting the default value –This will automatically appear in the text box to make filling it out less work for the user Setting the size of the box –Determines the length of the box in characters Limiting the length of the text –For zip codes of person’s age this will restrict the box to only accept 2 characters
Text Areas for Multi-Line Text Designed for open ended responses – How do you really feel about this issue? Or needs a tag WRAP will allow text to wrap to the next line (similar to Word Wrap in Notepad) –For Example – Watch online Lesson #1