HTML Buttons and Submit

« Prev Next »

The <button> element creates a clickable button. It can be used in forms or with JavaScript to perform actions.


Unlike <input type="submit">, the <button> element can contain text, HTML, and images.

html-button

Syntax

<button type="button">Click Me</button>

Button Types

Type Description
submit Submits the form data to a server
reset Resets all form fields to default values
button Generic button used for JavaScript actions

Submit Button (Form Submission)

Using <input type="submit">

<input type="submit" value="Submit Form">

Using <button type="submit">

<button type="submit">Submit</button>

Both do the same thing: submit the form data to the action URL using the form’s method (GET/POST).

 

Reset Button

Clears all input fields back to their initial values.

 

<input type="reset" value="Reset Form">

OR

 

<button type="reset">Reset</button

Example

<form action="/submit" method="post">
  <label for="name">Name:</label><br>
  <input type="text" id="name" name="name"><br><br>

  <label for="email">Email:</label><br>
  <input type="email" id="email" name="email"><br><br>

  <button type="submit">Submit</button>
  <button type="reset">Reset</button>
</form>
Run ›
notepad
  • Always declare the type (submit, reset, or button).
  • Use <button> for rich content and customizable control.
  • Use <input type="submit"> for simple forms if no extra content is needed inside.
« Prev Next »

Quickly Find What You Are Looking For

OnlineTpoint is a website that is meant to offer basic knowledge, practice and learning materials. Though all the examples have been tested and verified, we cannot ensure the correctness or completeness of all the information on our website. All contents published on this website are subject to copyright and are owned by OnlineTpoint. By using this website, you agree that you have read and understood our Terms of Use, Cookie Policy and Privacy Policy.