What is Form Tag?
Form is typical
layout on the web page by which a user
can interact with the web page.
Typical components of forms are
text, text area, checkboxes, radio buttons &
push buttons. These
components of form are also called as form controls.
HTML allows us to place
these form components on the web page.
All these form contents in the <form> tag.
The form has an attributes action which gets executed
user clicks a button on the form.
Uses of form:
1.
Forms are used to collect
the information from customer for online registration.
2.
Forms are used for online survey.
3.
Forms are used for conduction online examination.
4.
The information present
in the forms is submitted
to the server for furtherprocessing.
Properties &
Methods Of Form:
Syntax:
<form name=“myform” action=“/myserverPage” method= “GET”
target=“_blank”>
</form>
1. Text:
·
Text is typically required to place one line text.
· This control
is used for items that
require only one line of user input is known
as Single- line text input controls.
·
They are created
using HTML <input> tag.
2. Textarea:
· This is used when
the user is required to give details
that may be longer than a single sentence.
·
Multi-line input controls
are created using HTML <textarea> tag.
3. Button:
·
There are various
ways in HTML to create clickable buttons.
· You can also create
a clickable button
using <input>tag by setting its type attribute to button.
4. Checkbox:
·
Checkboxes are used when more than one option is required to be selected.
·
They are also created using HTML <input> tag but type attribute is set tocheckbox.
5. Radio button:
●
Radio buttons are used
when out of many options, just one option
is required to be
selected.
●
They are also created using
HTML <input> tag but type attribute is set to radio.
6. Select elements.
●
A
select box, also
called drop down box which
provides option to list downvarious options in the form of drop down list, from where
a user can select one or more
options.
Conclusion: We understand that how to create a webpage using form elements JavaScript.
Create a webpage
using Form Elements:
A]
<html>
<div
class="container">
<form >
<label
for="fname">First Name</label>
<input
type="text" id="fname" name="firstname"
placeholder="Your name.."><br>
<label
for="lname">Last Name</label>
<input
type="text" id="lname" name="lastname"
placeholder="Your last name.."><br>
<labelfor="country">Country</label>
<select id="country"name="country">
<option
value="india">India</option>
<option
value="canada">Canada</option>
<option
value="usa">USA</option>
</select><br>
<label
for="subject">Subject</label>
<textarea
id="subject" name="subject" placeholder="Write
something.." style="height:200px"></textarea><br>
<input
type="submit" value="Submit">
</form>
</div>
</html>
B]
<html>
<div
class="container">
<form >
<label
for="fname">First Name</label>
<input
type="text" id="fname" name="firstname"
placeholder="Your name.."><br>
<label
for="lname">Last Name</label>
<input
type="text" id="lname" name="lastname"
placeholder="Your last name.."><br>
<labelfor="Gender">Gender</label>
<select id="Gender"name="gender">
<option
value="Male">Male</option>
<option
value="Female">Female</option>
<option
value="Third gender">Third gender</option>
</select><br>
<labelfor="Language">Language</label>
<select
id="Language"name="Language">
<option
value="English">English</option>
<option
value="Hindi">Hindi</option>
<option
value="Marathi">Marathi</option>
</select><br>
<label
for="subject">Subject</label>
<input
type="submit" value="Submit">
</form>
</div>
</html>
Comments
Post a Comment