techygrrrl
techygrrrl's blog

techygrrrl's blog

Default button behaviour in forms

Default button behaviour in forms

techygrrrl's photo
techygrrrl
·Jun 19, 2022·

1 min read

Table of contents

  • Behaviour
  • Code Samples

This talks about what the default button behaviour is when you do not specify a type attribute on a button element.

TL;DR: Use a type attribute to avoid confusion.

Behaviour

  • Every button, when clicked, behaves as a submit button
    • The button's click handler is called
  • When the form is structured as a proper form and the user hits enter to submit the form, only the first button's click handler is triggered

form-button-behaviour.png

Code Samples

Vanilla JS

React

Vue

 
Share this