Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
How to use the submit button in HTML forms?
Submit button automatically submits a form on click. Using HTML forms, you can easily take user input. The <form> tag is used to get user input, by adding the form elements. Different types of form elements include text input, radio button input, submit button, etc.
Let's learn about how to use the submit button in HTML forms. It is created using HTML <input> tag with the type attribute set to "submit".
Basic Syntax
The submit button is created using the <input> tag with type="submit":
<input type="submit" value="Submit">
Complete Form Example
You can try to run the following code to use submit button to submit and reset a form. Under the action attribute, add the file where you want to reach after clicking the Submit button. Using get and post methods, you can send the values to the server-side file.
<!DOCTYPE html>
<html>
<body>
<form action="/new.php" method="post">
Student Name:<br>
<input type="text" name="sname" required>
<br><br>
Student Subject:<br>
<input type="text" name="ssubject" required>
<br><br>
<input type="submit" value="Submit">
<input type="reset" value="Reset">
</form>
</body>
</html>
Submit Button Attributes
| Attribute | Description | Example |
|---|---|---|
value |
Button text | value="Submit Form" |
name |
Button identifier | name="submit_btn" |
disabled |
Disables the button | disabled |
Alternative: Button Element
You can also create submit buttons using the <button> element:
<!DOCTYPE html>
<html>
<body>
<form action="/process.php" method="post">
<input type="text" name="username" placeholder="Enter username">
<br><br>
<button type="submit">Submit Data</button>
<button type="reset">Clear Form</button>
</form>
</body>
</html>
Key Points
- Submit buttons automatically submit form data when clicked
- Use
actionattribute to specify where form data should be sent - Use
methodattribute to specify GET or POST request - Reset buttons clear all form fields to their default values
- Add
requiredattribute to input fields for basic validation
Conclusion
Submit buttons are essential for HTML forms, automatically sending form data to the server when clicked. Use them with proper form attributes for effective data collection and processing.
5K+ Views
