Skip to content

Combobox: preserve pre-existing hidden input across lifecycle (#43281) - #43299

Open
Aryan9891 wants to merge 2 commits into
twbs:mainfrom
Aryan9891:fix/combobox-preserve-existing-hidden-input-43281
Open

Aryan9891 wants to merge 2 commits into
twbs:mainfrom
Aryan9891:fix/combobox-preserve-existing-hidden-input-43281

Conversation

@Aryan9891

Copy link
Copy Markdown
Contributor

Description

When a Combobox is placed in a server-rendered form or within a data grid, developers often provide a hidden <input> element with specific attributes (e.g. id, custom validation classes like is-invalid, or an initial value).

Currently, Combobox unconditionally creates a new <input type="hidden"> before the toggle and removes it when .dispose() is called. In dynamic workflows (such as updating rows or menus via AJAX), calling .dispose() removes the consumer's provided hidden input and discards custom validation states and attributes.

This PR addresses #43281 by:

  1. Reusing Pre-existing Hidden Inputs: In _createHiddenInput(), checking for an existing hidden input preceding the toggle or in its parent container before creating a new one.
  2. Initial Value Synchronization: When an existing hidden input contains an initial value, syncing the matching menu item's selection and toggle display during initialization.
  3. Preserving on Disposal: Tracking whether the hidden input was auto-created by the component (_createdHiddenInput). When .dispose() is called, only auto-created hidden inputs are removed from the DOM; pre-existing inputs, their IDs, and validation classes are preserved.
  4. Documentation: Clarifying pre-existing hidden input support in site/src/content/docs/forms/combobox.mdx.
  5. Unit Tests: Adding tests covering existing hidden input reuse with custom classes and attributes, initial value selection sync, and disposal preservation.

Fixes #43281

…3281)

- Check for an existing hidden input preceding the toggle or in parent element before creating a new one.
- Synchronize initial selection from existing hidden input value when present.
- Preserve pre-existing hidden inputs and their validation attributes on dispose, only removing auto-created inputs.
- Add unit test coverage for existing hidden input reuse and disposal preservation.
- Document pre-existing hidden input support in combobox documentation.

Fixes twbs#43281

Signed-off-by: Aryan Sachin <aryansachinixd@gmail.com>
@Aryan9891
Aryan9891 requested a review from a team as a code owner November 4, 2026 21:37
@julien-deramond julien-deramond added v6 v6, the main branch docs Documentation site and its content feature New feature, or a change to how an existing one works js JavaScript or TypeScript sources and plugins needs-decision A maintainer decides first: scope, design or breaking change and removed needs-decision A maintainer decides first: scope, design or breaking change labels Nov 4, 2026
…e budget

Signed-off-by: Aryan Sachin <aryansachinixd@gmail.com>
@netlify

netlify Bot commented Nov 5, 2026

Copy link
Copy Markdown

✅ Deploy Preview for twbs-bootstrap ready!

Name Link
🔨 Latest commit a23f086
🔍 Latest deploy log https://app.netlify.com/projects/twbs-bootstrap/deploys/6aec4c0c49181a5dda5cd7f3
😎 Deploy Preview https://deploy-preview-43299--twbs-bootstrap.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

docs Documentation site and its content feature New feature, or a change to how an existing one works js JavaScript or TypeScript sources and plugins v6 v6, the main branch

Projects

None yet

Development

Successfully merging this pull request may close these issues.

v6 Combobox: Do not auto-create and destroy hidden input if already exists.

2 participants