FORM TAG AND HTML COMMENTS

HTML Form Tag

Tag Description

<form> Defines a form for user input.

<input> Defines an input field data.

<button> Defines a push button

<textarea> Defines a text-area (a multi-line text input box).

<label> Defines a label to the description.

<fieldset> Defines a border to the input data.

<legend> Defines a caption name write into fieldset.

<select> Defines a drop-down select list box.

<option> Defines an option value in the drop-down box.

HTML <input> Tag

The most used form tag is the <input> tag. This is the most used tag within HTML forms. It give you
to specify various types of user information fields such as text, checkboxes, radio buttons, Select
Lists, Submit etc.
Attributes Value Description

type "text" use input text value.

"button" use to input button
"password" use to text is convert password type.
"file" use to browse file.
"checkbox" use to select option checkbox.
"radio" use to select in radio type.
"reset" use to input reset data.
"submit" use to input submit data.

value "value" Specify the default value of element.

name "value" Specify unique name for the input element.

FORM TAG AND HTML COMMENTS

size "number" Define width of numbered(character) size input box.

maxlength "number" Define maximum number(character) allow to enter input box.

checked   Specify input element to be checked when it is first time loaded.

alt "text" Define input name to identify.

align "left" Define input type align in HTML document.

"right"
"center"

src "URL" Define image open to mouse down submit.

HTML Form Controls

There are different types of form controls that you can use to collect data using HTML form −

 Text Input Controls

 Checkboxes Controls
 Radio Box Controls
 Select Box Controls
 File Select boxes
 Hidden Controls
 Clickable Buttons
 Submit and Reset Button

Text Input Controls

 Single-line text input controls: They are created using HTML <input> tag.

 Password input controls: They are also created using HTMl <input> tag
 Multi-line text input controls: 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.

Attributes

Following is the list of attributes for <textarea> tag.

Sr.No Attribute & Description
1
name
Used to give a name to the control which is sent to the server to be recognized and get the value.
2
rows
Indicates the number of rows of text area box.
FORM TAG AND HTML COMMENTS

3
cols
Indicates the number of columns of text area box

Checkbox Control

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 to checkbox.

Attributes

Following is the list of attributes for <checkbox> tag.

Sr.No Attribute & Description

1
type
Indicates the type of input control and for checkbox input control it will be set to checkbox..

2
name
Used to give a name to the control which is sent to the server to be recognized and get the value.

3
value
The value that will be used if the checkbox is selected.

4
checked
Set to checked if you want to select it by default.

Radio Button Control

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.

Attributes

Following is the list of attributes for radio button.

Sr.No Attribute & Description

FORM TAG AND HTML COMMENTS

1
type
Indicates the type of input control and for checkbox input control it will be set to radio.

2
name
Used to give a name to the control which is sent to the server to be recognized and get the value.

3
value
The value that will be used if the radio box is selected.

4
checked
Set to checked if you want to select it by default.

Select Box Control

A select box, also called drop down box which provides option to list down various options in the
form of drop down list, from where a user can select one or more options.

Attributes

Following is the list of important attributes of <select> tag −

Sr.No Attribute & Description

1
name
Used to give a name to the control which is sent to the server to be recognized and get the value.

2
size
This can be used to present a scrolling list box.

3
multiple
If set to "multiple" then allows a user to select multiple items from the menu.

Following is the list of important attributes of <option> tag −

Sr.No Attribute & Description

1
value
The value that will be used if an option in the select box box is selected.
FORM TAG AND HTML COMMENTS

2
selected
Specifies that this option should be the initially selected value when the page loads.

3
label
An alternative way of labeling options

File Upload Box

If you want to allow a user to upload a file to your web site, you will need to use a file upload box,
also known as a file select box. This is also created using the <input> element but type attribute is set
to file.

Attributes

Following is the list of important attributes of file upload box −

Sr.No Attribute & Description

1
name
Used to give a name to the control which is sent to the server to be recognized and get the value.

2
accept
Specifies the types of files that the server accepts.

Button Controls

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. The type attribute can take the following
values −

Sr.No Type & Description

1
submit
This creates a button that automatically submits a form.

2
reset
This creates a button that automatically resets form controls to their initial values.

3
button
FORM TAG AND HTML COMMENTS

This creates a button that is used to trigger a client-side script when the user clicks that button.

4
image
This creates a clickable button but we can use an image as background of the button.

Hidden Form Controls

Hidden form controls are used to hide data inside the page which later on can be pushed to the server.
This control hides inside the code and does not appear on the actual page. For example, following
hidden form is being used to keep current page number. When a user will click next page then the
value of hidden control will be sent to the web server and there it will decide which page will be
displayed next based on the passed current page

Form Attributes

Apart from common attributes, following is a list of the most frequently used form attributes −

Sr.No Attribute & Description

1
action
Backend script ready to process your passed data.

2
method
Method to be used to upload data. The most frequently used are GET and POST methods.

3
target
Specify the target window or frame where the result of the script will be displayed. It takes
values like _blank, _self, _parent etc.
FORM TAG AND HTML COMMENTS

HTML Comments - How to Write

Definition
 HTML comment tag use to insert a comment into a source code. It's good habit to
write a comment into a source code to improve user readability and understands.
 You can also write a specify information inside comments. In this case they will not
be display on web document and not visible for the user.
 A good habit is write comment text inside html pages, scripts and style elements.
 Comment Tag does not support any Standard Attributes.

HTML Comment Example

An HTML comment begins with "<!--" and ends with "-->".

CSS Comment Example

A CSS comment start with "/*" and ends with "*/" in css file.

JavaScript Comment Example

Single line comment start with //.

Multi line comment start with /* and end with */.

FORM TAG AND HTML COMMENTS