Seoxpert.io
Get started
lowOn-Page SEO

`<button>` Elements Without Explicit `type` Attribute

Buttons without a type attribute default to 'submit', which can cause accidental form submissions.

By Seoxpert Editorial · Published

Why it matters

If a <button> inside a form lacks a type attribute, it defaults to 'submit' per HTML spec. This can cause unintended form submissions when the button is intended for UI actions only, leading to user frustration and potential loss of data or conversions.

Impact

Leaving this unresolved can result in accidental form submissions and a poor user experience.

How it's detected

Automated crawlers detect <button> elements missing a type attribute within HTML content.

Common causes

  • •Developers assume <button> defaults to a neutral action, not 'submit'.
  • •Copy-pasting button code without specifying type.
  • •UI-only buttons (like toggles or counters) placed inside forms.
  • •Lack of awareness of HTML's default behavior for <button>.
  • •Missing linter or code review rules enforcing explicit types.

How to fix it

Always add a type attribute to every <button>. Use type="button" for non-submit actions and type="submit" for the form's submit button. Search your codebase for <button> tags and update them accordingly. Consider enabling a linter rule (e.g., react/button-has-type) to catch this in the future.

Code examples

Problem: Button without type inside a form

<form>
  <button>Show Password</button>
</form>

Fix: Add type="button" for non-submit actions

<form>
  <button type="button">Show Password</button>
</form>

Fix: Use type="submit" for the actual submit button

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

FAQ

Why does my form submit when I click a button that shouldn't submit?

Because <button> defaults to type="submit" if no type is specified, causing it to submit the form.

Can I omit the type attribute if my button is outside a form?

Yes, but it's best practice to always specify the type for clarity and future-proofing.

How do I prevent accidental form submissions from UI-only buttons?

Add type="button" to all buttons that are not meant to submit the form.

Is this issue relevant for accessibility or SEO?

Indirectly, as unexpected form submissions can harm user experience, which may affect engagement metrics relevant to SEO.

Found this issue on your site?

Run a scan to see if `<button>` Elements Without Explicit `type` Attribute affects your pages.

Scan my website →