Skills
.Work. You
Rest

html-button-type-submit-gotcha

Community

Prevent form submits with explicit button types.

Software Engineering#React#UI#HTML#form#type#button
AuthorHankanman
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Buttons inside forms without an explicit type default to submit, causing unintended submissions when users intend actions like close, cancel, or toggling UI. This Skill addresses that gotcha by guiding developers to enforce explicit type attributes on all UI buttons.

Core Features & Use Cases

  • Enforces explicit type="button" for non-submitting UI controls (Close, Cancel, Dismiss) inside forms.
  • Documents common patterns across HTML, React components, and other frameworks to prevent accidental form submissions.
  • Provides practical examples showing how to update components to avoid submit behavior during UI interactions.

Quick Start

Review all buttons inside forms and explicitly set type="button" for UI buttons (e.g., Close, Cancel) and type="submit" only for actual submit actions. Update components in HTML and React to prevent default submission behavior.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: html-button-type-submit-gotcha
Download link: https://github.com/Hankanman/claude-config/archive/main.zip#html-button-type-submit-gotcha

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.