1. ECA 228 Internet/Intranet Design I Forms

2. ECA 228 Internet/Intranet Design I Forms forms are a way for a user to communicate with you – text fields – radio button – checkboxes – drop down menus – buttons

3. ECA 228 Internet/Intranet Design I Forms forms will not be much use unless you provide a way to process the user’s information – cgi – other scripting languages send email save to database write cookie – mailto – form processing service

4. ECA 228 Internet/Intranet Design I to create a form use the tagset all other parts of a form are placed inside the tagset Attributes: – name – method – action – enctype

5. ECA 228 Internet/Intranet Design I attributes name – gives a unique id to the form – if your page contains more than one form, give each a unique name every form element will be given a unique name DO NOT use spaces in the name … rest of form elements …

6. ECA 228 Internet/Intranet Design I attributes cont … method – tells browser how to send the user’s data – get appends data to URL limits the amount of data that can be sent – post

7. ECA 228 Internet/Intranet Design I attributes cont … method – what the user types into a form element is paired with the name we give the element – when the form is submitted, the data is sent as name/value pairs firstName=Bubba&lastName=LeTourneaux&email= bubba@bubba.net

8. ECA 228 Internet/Intranet Design I attributes cont … action – indicates how the user input is to be processed cgi other scripting language mailto form processing service

9. ECA 228 Internet/Intranet Design I attributes cont … enctype – indicates how the data being sent is to be formatted – if you are using mailto: as the action, set the enctype to “text/plain” – if you are using a script to process the form, do not use the enctype attribute

10. ECA 228 Internet/Intranet Design I form elements text boxsubmit passwordreset checkboxhidden radioimage selectbutton textareafile many form elements are defined as an attribute inside the tag

11. ECA 228 Internet/Intranet Design I text required attributes – type – name optional attributes – size – maxlength – value

12. ECA 228 Internet/Intranet Design I password required attributes – type – name optional attributes – size – maxlength – value

13. ECA 228 Internet/Intranet Design I radio required attributes – type – name – value optional attributes – checked

14. ECA 228 Internet/Intranet Design I radio cont … give the same name to groups of related radio buttons change the value in groups of related radio buttons radio buttons allow only one choice per set

15. ECA 228 Internet/Intranet Design I radio cont … h

16. ECA 228 Internet/Intranet Design I checkbox required attributes – type – name – value optional attributes – checked

17. ECA 228 Internet/Intranet Design I checkbox cont … give the same name to groups of related checkboxes change the value in groups of related checkboxes checkboxes allow more than one choice per set

18. ECA 228 Internet/Intranet Design I checkbox cont … h

19. ECA 228 Internet/Intranet Design I tagset creates a drop down menu required attributes – name optional attributes – size – multiple – selected

20. ECA 228 Internet/Intranet Design I cont … tag is placed between tagset required attributes of – value Golden Retriever Border Collie German Shepherd Standard Poodle Papillon

21. ECA 228 Internet/Intranet Design I cont … To change the drop down menu to a list box use the size attribute Golden Retriever Border Collie German Shepherd Standard Poodle Papillon

22. ECA 228 Internet/Intranet Design I cont … To allow more than one choice use the multiple attribute Golden Retriever Border Collie German Shepherd Standard Poodle Papillon

23. ECA 228 Internet/Intranet Design I cont … To pre-select an option use the selected attribute Golden Retriever Border Collie German Shepherd Standard Poodle Papillon

24. ECA 228 Internet/Intranet Design I cont … To group menu items use the tagset with the label attribute Golden Retriever Border Collie German Shepherd Standard Poodle Papillon

25. ECA 228 Internet/Intranet Design I required attributes – name – rows – cols Please write your comments here

26. ECA 228 Internet/Intranet Design I submit required attributes – type optional attributes – value

27. ECA 228 Internet/Intranet Design I reset required attributes – type optional attributes – value

28. ECA 228 Internet/Intranet Design I image required attributes – type – src – width – height – alt

29. ECA 228 Internet/Intranet Design I hidden required attributes – type – name – value

30. ECA 228 Internet/Intranet Design I button required attributes – type – name – value

31. ECA 228 Internet/Intranet Design I file required attributes – type – name additional attributes – size in tag must use enctype = “multipart/form-data” as attribute

32. ECA 228 Internet/Intranet Design I organizing form elements to separate a form into smaller organized units use the tagset optional tagset provides textual label Personal Information Last Name: First Name: Address: City: : State: