HTML button type=”submit” Attribute
This guide will teach about the HTML “<button>” having attribute value “submit”. So, let’s dive in!
How to Add HTML button type=“submit” Attribute?
In HTML, first, add a <div> having a class name “myform”. Then, perform the following steps:
- Inside the div, add <h1> tag for the heading.
- Then, add two text boxes for first and last names with labels. The “for” attribute of the “label” tag and the “id” attribute of the “input” tag must be the same. This will associate the caption with the input control.
- Add a button with the “type” value set as “submit”, “value” as “submit”, and “id” as “submit”.
- After that, associate the “addData()” function with the submit button, which will trigger when the button is clicked. This form will take the data from the user and display them on the same page.
Let’s apply some CSS styles to the above-mentioned div. Here, the “.myform” refers to the div name mentioned in the HTML file:
- Assign the “background-color” property value as “#81b29a”.
- “text-align” as “center” aligns the content of the div in the center.
- The “height” property value is set as “300px”.
- “font-size” is set as “large”.
It can be observed that after entering the first and last name when the “Submit” button is clicked, the names are displayed in the labels:
We have learned how the HTML submit button functions with practical demonstration.