v149 · Web Components · Forms
Form Lifecycle Demo
When a custom element with HTMLSubmitButtonBehavior is inserted into or removed from a <form>, it connects and disconnects from the form's lifecycle automatically — just like a native <button type="submit">. This demo shows the form-association state and logs every lifecycle event in real time.
Live form with custom submit element
outside the form
Move the custom element here to watch form association disconnect.
—form-associated
—internals.form
—in form.elements
NOdisabled callback
// Lifecycle events will appear here…
see also
- Fancy Submit — minimal custom submit element
- Keyboard Activation — Enter/Space key support
- Custom Toggle Button — autonomous custom element
- ChromeStatus entry
implementation reference
Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗