INTRODUCING FORMS:
Start by looking at an example of forms.You can look at Google homepage, which contains two kinds of form controls:
➤➤ Text input: Where you enter your search term.
➤➤ Submit buttons: Send the form to the server. There are two on this form: You can see the
words Google Search written on the first one and I’m Feeling Lucky on the second.
The form has many more types of controls:
➤➤ Select boxes: Sometimes referred to as drop-down lists, to choose from a list of provided answers.
➤➤ Radio buttons: Such as the ones in the top-right corner with Yes or No options. When you
have a group of radio buttons, you can pick only one response.
➤➤ Check boxes: Such as the ones at the bottom of the screenshot indicating how you can be
contacted (by e‑mail, post, or phone). When you have a group of check boxes, you can pick
more than one response.
➤➤ Text inputs: To enter a variety of information, or in this case a date of birth and registration
number.
Now have some practical look at these forms through some examples:
.png)
<html>
<head></head>
<body background="C:\Users\500040364\Downloads\1871427.jpg">
<center><b><u>APPLICATION FORM</u></b><br>
<h1>Electronic Service and Training Center</h1></center><br>
<OL type="1">
<li><b>NAME</b>:<b>[Mr/Miss/Mrs]</b>:- 
<input type=Textbox value="First name" name=" ">  
<input type=Textbox value="Middle name" name=" ">  
<input type=Textbox value="Last name" name=" "></li><br>
<li><b>FATHER'S NAME</b>:-      
<input type=Textbox value="First name" name=" ">  
<input type=Textbox value="Middle name" name=" ">  
<input type=Textbox value="Last name" name=" "></li><br>
<li><b>ADDRESS</b>:-   
<input type=Textbox name=" "></li><br>
<li><b>PIN CODE</b>:-   
<input type=Textbox name=" "></li><br>
<li><b>MOB NO.</b>:-   
<input type=Textbox name=" ">   
<input type=Textbox value="STD CODE" name=" "></li><br>
<li><b>DATE OF BIRTH</b>:-  
<input type=Textbox name=" "></li><br>
<h2><b>CATEGORY</b></h2>
SC <input type=radio name=" ">   
ST <input type=radio name=" ">   
OBC <input type=radio name=" ">   
GEN <input type=radio name=" "><br><br>
<li><b>EDUCATION QUALIFICATION</b>:-<br>
<table border=2 cellpadding=5>
<tr>
<th>S. NO.
<th>EXAM
<th>BOARD
<th>UNIVERSITY
<th>YEAR
<th>SUB
</tr>
<tr>
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
</tr>
<tr>
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
</tr>
<tr>
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
<td><input type=Textbox name=" ">
</tr></table>
</li><br>
<li><b>COURSE OPTED</b>:-<br>
NAME: <input type=Textbox name=" "><br><br>
CODE: <input type=Textbox name=" "><br><br>
DATE: <input type=Textbox name=" "><br><br>
D.O.J: <input type=Textbox name=" "></li><br>
<li><b>PREFERENCE FOR THE SLOT</b>:-<br>
MORNING <input type=radio name=" ">      
EVENING <input type=radio name=" "><br></li><br>
</OL>
<center><input type=button value=SUBMIT>   <input type=button value=RESET>   <input type=button value=EXIT>
</center>
</body>
</html>
.png)
<html>
<head></head>
<body>
<center><h1><b>ENTRY FORM</b></h1></center>
<h2>Fill the form with your details:-</h2>
<OL type="1">
<li>Name:<input type=Textbox name=" "></li><br>
<li>Age:<input type=Textbox name=" "></li><br>
<li>Password:<input type=Textbox name=" "></li><br>
<h3>Sex Code</h3>
<li>MALE<input type=radio name=" "></li>
<li>FEMALE<input type=radio name=" "></li><br>
<h3>Select your Choice</h3>
<li>Reading:<input type=checkbox name=" "></li>
<li>Learning Dance:<input type=checkbox name=" "></li>
<li>Music:<input type=checkbox name=" "></li>
<li>Painting:<input type=checkbox name=" "</li>
<li>Basketball:<input type=checkbox name=" "></li>
<h3>Select your country</h3>
<li><Select>
<option>INDIA</option>
<option>AUSTRALIA</option>
<option>ENGLAND</option></select></li>
</OL><br>
<center><input type=button value=SUBMIT>   <input type=button value=RESET>   <input type=button value=EXIT></center>
</body>
</html>
.png)
<html>
<head></head>
<body>
<h1><center><b><u>SUBMISSION FORM</u></b></center></h1>
<OL type="1">
<li>ENTER YOUR COMMENT:-<br>
<TextArea cols="50" row="70"></TextArea></li><br>
<li>ENTER YOUR CITY:-<br>
<select>
<option>New Delhi</option>
<option>Dehradun</option>
<option>Lucknow</option></select></li><br>
<li>ENTER YOUR PINCODE:-<br>
<select>
<option>248001</option>
<option>248008</option>
<option>248007</option></select></li>
</OL>
<center><input type=button value="SUBMIT">   <input type=button value="RESET">   <input type=button value="EXIT"></center>
</body>
</html>
By now,you must be having a basic knowledge of FORMS and how to implement them,
No comments:
Post a Comment