Transcript
Unit 11 – Forms
Presentation 2
Web Programming
Objectives
At the end of this presentation, you will be able to• Add a Check Box to a Form• Add a Drop-Down List Box to a Form• Add a Button to a Form
Check Box• The Check Box is a control that is used to
display an option to the user.• <INPUT> tag is used to add Check Box.• The attributes of the <Input> tag related to the
Check Boxes are given in Table.
Drop-Down List Box• Used to display a list of items in a rectangular
box from which the user can select an option.• Added to a form using the <SELECT> tag
along with <OPTION> tag. • The attributes of the <SELECT> tag are given
in Table.
Option Control
• The attributes of the <OPTION> tag are given in Table.
Button Control
• The Button is a control that is used to display a push button.
• Buttons can be added to a form using the <BUTTON> tag.
Button Tag Attribute
• The attributes of the <BUTTON> tag are given in Table.
Lab Exercise
3. Open D11_2.html in Internet Explorer. a. Locate the input type which is used to choose
more than one option.b. Name the input type which is used to choose
single option.c. Identify the tag which is used to display the
drop-down menu options.d. Name attributes which are used in
<SELECT>.
Lab Exercise
4. Write a HTML code to display the output as given in the following Figure using <FORM> tag.
Lab Exercise
5. Write a HTML code to display the output as given in the following Figure using <FORM> tag.
Lab Exercise
6. Write a HTML code to display the output as given in the following Figure using <FORM> tag.
Lab Exercise
7. Write a HTML code to display the output as given in the following Figure using <FORM> tag.
Lab Exercise
8. Write a HTML code to display the output as given in the following Figure <FORM> and <TABLE> tag.
Lab Exercise
9. Write a HTML code to display the output as given in the following Figure using <FORM> and <FRAME> tag.
Activity 2.11.2
• Create a Web page that displays a form to enter user’s personal details (Bio-Data).
• Save the HTML file as Activity1.html in C:\HTML\Unit11\Activity folder.
Activity 2.11.3
• Create a Web page that explains the Form as shown in Figure.
• 2. Save the HTML file as Activity2.html in C:\HTML\Unit11\Activity folder.
• 3. The hyperlink Adding Controls at the bottom of the page should be linked to Add_Controls.html.
Activity 2.11.3 Contd.
Activity 2.11.4
• Create a Web page that explains the controls as shown in Figure.
• Save the HTML file as Add_Controls.html in C:\HTML\Unit11\Activity folder.
• The content of the same page is continued in Figure.
Activity 2.11.4 Contd.
Summary
In this presentation, you learnt the following:• Drop-Down List Box can be added to a form
using the <SELECT> tag along with <OPTION> tag.
• Buttons can be added to a form using the <BUTTON> tag along with the Type attribute.
Assignment
1. Name any 5 controls that can be added to a Form.
top related