Skip to main content

How to create HTML Form - I

How to create HTML Form

In this tutorial, we will learn about  How to create HTML Form. So far we have discussed how to create a frametablesList, insert Images, Linking in HTML etc. HTML Form is one of the most important  part of the websites  Every website has Contact forms or feedback forms.. Filling the Digital forms  saves time, cost of printing, and  paperwork  Before learning about how to create a Form lets understand  what is a form?

What is a form?

Dictionary meaning of the form is  a blank document or template to be filled in by the user, in the same way as HTML Forms. HTML Forms are used  to gather/collect information about an user or customer, such as  his or her  e-mail address, name, address, phone, date of birth and, educational qualification etc. 
<form></form> tag is used to create the HTML Form as given below.
<form action="abc.php" method="">
----------
---------
</form>

Attributes of <form> tag
1. Action = "abc.php" -  The action to be performed when the form is submitted.
2. Method="Post" or "Get" -  By default, the method is Get. It is used to display the submitted form data in the address bar of the browser.  If the user changes the method to post then the submitted form data will not appear in the address bar of the browser. It is used to send a large amount of data in one go.

Form Controls

<Input> :
<input> tag is used to create interactive controls using type attributes.
1. <input type="Text">         Text is used to enter single line data. i.e. not more the 255.
2. <input type="radio">        Radio is used to create radio button. It is used to select only one
                                                  option from multiple options.
3. <input type="submit">      Submit button is used to submit the form.
4. <input type ="checkbox"> Checkbox is used to create Checkbox. It is used to select multiple.

 Atributes of <input> tag
  1. Type="radio" / "text"/"checkbox"/"submit" 
  2. Name="name of the element"
  3. Value= "text" - specifies the default value.
  4. Maxlength=value - Specifies the maximum number of characters in the text box.
  5. Size=value - Specifies the width of the text box.
Text in the Form 

Text is used to enter single line data i.e. not more than 255 characters. 

Example:

How to create form- Text
The output is :


how to create a form using text
How to create form - text 

Radio Button in the Form

Radio button  is used to select only one option out of many option. 

Example:


how to create a form
Output is 


How to create form - radio button
Output is :

How to create form - Radio button
Text Area in the Form

Textarea it is used to enter the multi-line text.
Atributes of Textarea:
  1. name="name of the textarea"
  2. rows=value - Numbers of rows.
  3. cols=value -  Numbers of column.
 Example:
how to create form- textarea
To create form using Textarea
       Output is 

How to create form using Textarea




NEXT

Comments

Popular posts from this blog

Table in HTML

Table is used to store data in the form of rows and columns.<Table> </Table > tag is used for creating the table.   Tags used for creating  the table  is as follows Tags Description <table></table> <tr></tr> It defines the table row. <th></th> It defines the table heading. <td></td> It defines the table data. <caption></caption> It defines the caption of the table. Attributes of the <table></table> tag. Attributes Value Description Bgcolor Color name Changes the background color of the table. Background Path of the image Applies the image as the background. Border Value (eg. 1,2,10) It is used to apply the border thickness of the table. BorderColor Color name It changes the color of the table bord...

Linking in html

Linking is used for linking the web page with the another web page. One can create linking with  <a> </a> tag. It is also called anchor tag. One can create linking with the text, linking with the image. The attribute of <a></a> href="path" target="frame name" or _top or _blank or _self or _parent Linking with the Text  One can create linking with the text. Example of it is given below   Example <html> <head> <title> linking with text </title> </head> <body> <a href="file:///C:/Program%20Files/Java/jre1.8.0_31/Welcome.html">click here</a> </body> </html> The output of the above  code is Linking with Image Now, one can also create linking with the image. Example <html> <head> <title> linking with image </title> </head> <body> <a href="file:///C:/Program%20Files/Java/jre1.8.0_31/Wel...

HTML FRAMES - HTML Frames Example with Output

Post Updated :16-02-2018 HTML Frames is used to display more than one file. It is used to divides the browser window into different parts or sections  i.e.  row-wise or column-wise or row and column-wise . Each section can display HTML files.To create a frame  two tags are used they are <frameset> and <frame> tag. Attributes of  <frameset>    tag 1. Cols=value is % or pixels 2. Rows= values in % or pixels Attributes of <frame> tag 1. Src= "path" 2. Name="name of the frame" 3. Border= value in pixels 4. Noresize 5. Scrolling="true" or "false" 6. Marginwidth=value in % or pixels 7. Marginheight=value in % or pixels If I want to divide the browser into two columns. The following example will be used to divide the window into 2 section. In the example given below we are using to divide the browser into equal sections i.e. 50% each. HTML Frames Example with Output Simple example of two- framed page ...