creating forms 101!
DESCRIPTION
Creating Forms 101!. December 2, 2009. For Today:. Look at Forms! Definition Tags Example Program Lunch Room Project Test next week on Tables and Forms! Maybe Wednesday???? Don’t forget to register at www.bliinkcontest.com . Referral code is greenillinois - PowerPoint PPT PresentationTRANSCRIPT
![Page 1: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/1.jpg)
Creating Forms 101!
December 2, 2009
![Page 2: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/2.jpg)
Look at Forms!◦ Definition ◦ Tags
Example Program Lunch Room Project Test next week on Tables and Forms! Maybe
Wednesday???? Don’t forget to register at www.bliinkcontest.com. Referral code is greenillinois
Tomorrow – Speaker for 6th – Ms. Shavetta Johnson regarding Security Issues on the Internet! Please be on time!!!!
For Today:
![Page 3: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/3.jpg)
When forms are included on a Web page, the page can be used for more than information sending; it can be used for information gathering!
Use a form to interact with your web page visitor including:◦ Get feedback about the Web page or other areas
of interest◦ Find out who is visiting the Web page◦ Sell products or services◦ Act as a guestbook
Creating Web Page Forms
![Page 4: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/4.jpg)
1. Input controls2. A <FORM> tag (which contains the
information necessary to process the form)3. A submit button (which sends the data to be
processed)
Three main componets
![Page 5: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/5.jpg)
Are any type of input mechanism on a form! There are two types – data input control and text
input control. Data examples:
◦ Radio button◦ Check box◦ Submit button◦ Reset button◦ Selection menu (drop-down)
Text examples:◦ Text field◦ Textarea field◦ Password text field
Input Controls
![Page 6: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/6.jpg)
![Page 7: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/7.jpg)
Form Tags
![Page 8: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/8.jpg)
More tags
![Page 9: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/9.jpg)
We will be using the following options:◦Text Field◦Select Menu◦Radio
buttons◦Checkboxes◦Submit and
reset buttons
Example Web Page!
![Page 10: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/10.jpg)
Open Notepad. Enter your initial tags. Do you remember
them? If not, here they are:<HTML><TITLE> Example of a simple form</TITLE><BODY>
</BODY></HTML>
Let’s get started.
![Page 11: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/11.jpg)
Insert the following between your body tags!
Example of using Radio buttons, text
fields, pull down menu or selection menu, and checkboxes on a form!
<br> Don't forget your submit buttons and
reset buttons!<br>
Let’s enter form tags:
![Page 12: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/12.jpg)
Enter your form tags:
<FORM>
Enter your first name<INPUT TYPE = “TEXT” SIZE=”25”><BR>Enter your last name:<INPUT TYPE = “TEXT” SIZE =”25”><P>
![Page 13: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/13.jpg)
<SELECT><OPTION SELECTED> Pick your favorite
team from the list:<OPTION>Chicago Bulls<OPTION>Utah Jazz<OPTION>Los Angeles Lakers<OPTION>Indiana Pacers<OPTION>Phoenix Suns<OPTION>New Jersey Nets</SELECT>
![Page 14: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/14.jpg)
<P>The best place to eat is:<BR><INPUT TYPE="RADIO" NAME="BEST">
Wendy’s<BR><INPUT TYPE="RADIO" NAME="BEST">
McDonald’s<BR><INPUT TYPE="RADIO" NAME="BEST"> Taco
Bell<BR><INPUT TYPE="RADIO" NAME="BEST"> Burger
King<BR><INPUT TYPE="RADIO" NAME="BEST">
Kentucky Fried Chicken<BR><P>
![Page 15: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/15.jpg)
I like to eat:<BR><INPUT
TYPE="CHECKBOX">Hamburgers<BR><INPUT TYPE="CHECKBOX">Tacos<BR><INPUT TYPE="CHECKBOX">Chicken
Strips<BR><INPUT TYPE="CHECKBOX">Fries<BR><INPUT TYPE="CHECKBOX">Hot
Dogs<BR><P>
![Page 16: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/16.jpg)
<P><INPUT TYPE="submit" VALUE="Submit the Form">
<INPUT TYPE="reset" VALUE="Reset the Form">
<P>Thank you for your input.</P>
</FORM><HR>
</body></html>
![Page 17: Creating Forms 101!](https://reader035.vdocument.in/reader035/viewer/2022062501/568160ae550346895dcfced8/html5/thumbnails/17.jpg)
Save as Simpleform.html Open in Internet Explorer for credit!_________________________________________________Today’s Assignment:1. Finish your worksheet #1. You have a project to work
on.2. Worksheet #2.
Test Next week-Wednesday?
Tomorrow we have a speaker – don’t be late! Monday we will have a visitor! Be on your best
behavior! No games, etc. Please.... I need help with Prosser’s Website...Who is ready to
help? Come and see me. First assignment is taking pictures and setting up clubs.