html/button-type

Why

A <button> with no type submits its form. A "Show password" or "Add row" button inside a form then sends the form by accident, and the bug appears only when the markup is moved into a form later.

Fix

Write type="button" on every button that runs script, and type="submit" on the one that submits, so intent is visible in the markup.

Examples

<!-- bad -->
<button onclick="toggle()">Show password</button>
<!-- good -->
<button type="button" onclick="toggle()">Show password</button>

Sources

• MDN, the button element (type)
• WHATWG HTML, the button element

Read it in the terminal

npx github:dawidolko/frontend-skills explain html/button-type