1. Collecting Information from the User
Form Elements

2. Why Use a Form? Collect info from user Example info:
Contact info
Choices for Products to Buy
Survey results
Quiz results

3. Elements of a Basic Form

4. Place a Form on Your Page
Entire form will be surrounded by <form> tags
All elements on your form placed between these tags
Choose the name – should make sense for overall purpose of form
We will add additional attributes later once we need to get the form actually working!

5. Text Turns this element into a text box
Provides a name – so we can access information collected from this element later!
Our code creates this – difficult for user to know what to type!

6. Now the user will know what we want!
Text
Now the user will know what we want!

7. Text Can set value in text box to a default Can be annoying for user
Not typically done

8. Now What?
Can add multiple textboxes to ask for multiple pieces of info
User needs a way to send that info somewhere

9. Setting value of type attribute to “submit” creates a submit button.
Will pick up automatic meaning once we code this form to actually work.

10. Alter Label on the Submit Button
Adding a value will alter the text that appears on the submit button.

11. Reset Button
Will clear (erase values inside) all form fields when pressed
Helps user reset form completely

12. Prevent All Fields on Same Line
You may use break tags between form elements

13. Will not allow the user to type more than 100 characters
Formatting
Makes it display enough room for 100 characters (the default is 20 characters)
Will not allow the user to type more than 100 characters