HTML Form Structure

Posted on Updated on

HTML Form Structure

The < form > Element is use to submit the value from user to database using intermediated language like php java or asp.net. in daily life we use to fill the many form for bus pass train ticket booking, admission form etc. So web developer make e-forms for reduce the uses of paper. With the help of html form tag and some input tags we can make very interactive forms which user can easily understand. HTML structures are utilized to gather client data.

The < form > component characterizes a HTML structure:

< form >

.

structure components

.

< /form >

HTML structures contain structure components. Structure components are distinctive sorts of data components, checkboxes, radio buttones, submit buttones, and that’s just the beginning.

The < input > Element.

The < input > component is the most important structure component.

The < input > component has numerous varieties, contingent upon the sort characteristic.

Here are the sorts utilized as a part of this section:

Type Description

text Defines normal text input

radio Defines radio button input (for selecting one of many choices)

submit Defines a submit button (for submitting the form)

Note You will take in significantly more about info sorts later in this instructional exercise.

Content Input

< input type = “ text “ > characterizes an one-line information field for content data:

Eg.

< form >

To begin with name:< br >

< input type = “ text “ name = “ firstname “ >

< br >

Last name:< br >

< input type = “ text “ name = “ lastname “ >

< /form >

Attempt it Yourself »

This is the means by which it will look like in a program:

To begin with name:

Last name:

Note: The structure itself is not noticeable. Additionally take note of that the default width of a content field is 20 characters.

Radio Button Input

< input type = “ radio “ > characterizes a radio button.

Radio buttones let a client select ONE of a predetermined number of decisions:

Sample

< form >

< input type = “ radio “ name = “ sex “ value = “ male “ checked > Male

< br >

< input type = “ radio “ name = “ sex “ value = “ female “ > Female

< /form >

Attempt it Yourself »

This is the way the HTML code above will be shown in a program:

Male

Female

The Submit Button

< input type = “ submit “ > characterizes a button for presenting a structure to a structure handler. The structure handler is regularly a server page with a script for preparing information.

The structure handler is determined in the structure’s activity quality:

Case

< form action = “ action_page.php “ >

In the first place name:< br >

< input type = “ text “ name = “ firstname “ value = “ Mickey “ >

< br >

Last name:< br >

< input type = “ text “ name = “ lastname “ value = “ Mouse “ >

< br > < br >

< input type = “ submit “ value = “ Submit “ >

< /form >

Attempt it Yourself »

This is the manner by which the HTML code above will be shown in a program:

In the first place name:

Last name:

The Action Attribute

The activity credit characterizes the activity to be performed when the structure is submitted. The normal approach to present a structure to a server, is by utilizing a submit button. Regularly, the structure is submitted to a page on a web server.

In the sample over, a server-side script is determined to handle the submitted structure:

< form action = “ action_page.php “ >

On the off chance that the activity characteristic is precluded, the activity is set to the present page.

The Method Attribute

The strategy quality indicates the HTTP system (GET or POST) to be utilized while presenting the structures:

< form action = “ action_page.php “ method = “ get “ >

on the other hand:

< form action = “ action_page.php “ method = “ post “ >

At the point when to Use GET?

You can utilize GET (the default technique):

On the off chance that the structure accommodation is inactive (like a web index question), and without delicate data.

When you utilize GET, the structure information will be unmistakable in the page address:

action_page.php?firstname=Mickey&lastname=Mouse

Note GET is most appropriate to short measures of information. Size restrictions are set in your program.

At the point when to Use POST?

You ought to utilize POST:

On the off chance that the structure is overhauling information, or incorporates touchy data (secret key). POST offers better security in light of the fact that the submitted information is not noticeable in the page address.

The Name Attribute

To be submitted effectively, every information field must have a name characteristic. This eg. will just present the “ Last name “ info field: Eg.

< form action = “ action_page.php “ >

To begin with name:< br >

< input type = “ text “ value = “ Mickey “ >

< br >

Last name:< br >

< input type = “ text “ name = “ lastname “ value = “ Mouse “ >

< br > < br >

< input type = “ submit “ value = “ Submit “ >

< /form >

Attempt it Yourself »

Gathering Form Data with < fieldset >

The < fieldset > component gatherings related information in a structure.

The < legend > component characterizes a subtitle for the < fieldset > component.

Eg.

< form action = “ action_page.php “ >

< fieldset >

< legend > Personal information:< /legend >

To begin with name:< br >

< input type = “ text “ name = “ firstname “ value = “ Mickey “ >

< br >

Last name:< br >

< input type = “ text “ name = “ lastname “ value = “ Mouse “ >

< br > < br >

< input type = “ submit “ value = “ Submit “ >

< /fieldset >

< /form >

Attempt it Yourself »

This is the means by which the HTML code above will be shown in a program:

Individual data:

To begin with name:

Last name:

HTML Form Attributes

A HTML < form > component, with every single conceivable quality set, will resemble this:

< form action = “ action_page.php “ method = “ GET “ target = “ _blank “ acknowledge charset = “UTF-8 “ enctype = “ application/x-www-structure urlencoded “ autocomplete = “ off “ novalidate >

.

structure components

.

< />

For more details and queries please feel free to email, visit or call us. Wishing you the very best for all your future endeavors.

Helpline: 9814666333, 8699444666

Email:info@technocampus.co.in

**************************************************************************************************************

Please fill the FORM and we shall contact you soon.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s