HTML input tags

Now that you know about the form tag and the role it plays in transferring the user inputs to the server it’s time to learn our first and most important input tag which you will find in every form – the submit button. In the previous tutorial you learnt that the role of HTML form is to collect the data from the user and submit it back to the server. The question to be asked here is that how a form gets submitted to the server. The answer to this is - by using the submit button.

The input tag has two important attributes

  1. Type – This tells what type of input tag you want to create.
  2. Value – This is the value which an input tag holds and which gets submitted to the server.

To create a submit button you will set the type attribute of the input tag to submit and set the value attribute to the text you want to be displayed on the submit button.

Look at the HTML mark-up below where we are creating an HTML form with a submit button

<html>      
    <head>      
    </head>      

    <body>
          
        <form action="http://abc.com/index.html" method="GET">              
            <input type="submit" value="Click me to submit form" />          
        </form>      
    </body>  
</html>



This is how the browser will display the above HTML

Image 

Here you cannot see the form but you can see the submit button which has been created by the input tag whose type attribute is set to submit. The text we wrote for the value attribute has been displayed on the button. On clicking this button, the form will get submitted to the URL which you specify in the action attribute of the <form> tag.

Need Learning Guidence?
Join our Study Groups and get step by step guidence.
Learn HTML and CSS
The goal of creating this study group is to help students who are beginners to HTML and CSS program
7
Members
1
Questions Asked
0
Tasks Added
Learn Website Development
This goal of this study group is to help students learn the basics of website development using HTM
1
Members
0
Questions Asked
0
Tasks Added
Website Development Interview Preparation
This goal of this study group is to help students prepare for their website development interviews.
1
Members
0
Questions Asked
0
Tasks Added
Web Wars 1.0 - Build Your Digital CV
The goal of this study group is to manage all the communication for the 'Web Wars 1.0 - Build Your
110
Members
0
Questions Asked
0
Tasks Added

Quick Links

E-Magazines

@

Total Followers
Study Group Created
Study Group Joined
Following Teacher
Following Organization
Blog Articles Added
Questions Asked
Questions Answered
Jobs Posted
Total Members in Group
Questions asked by members
Tasks added in this Group

Please wait..

Ok

Login to Open ESchool OR Create your account    Login   SignUp