feat: `form` property on form components

[oliveryasuna]

Prerequisites

• [X] I have read the Contributing Guidelines.
• [X] I agree to follow the Code of Conduct.
• [X] I have searched for existing issues that already include this feature request, without success.

Describe the Feature Request

It seems that some of the form components support a form property. For example, ion-button, supports either string (standard, by ID) or HTMLFormElement, which is super useful.

I would love to see this property on other form components, such as ion-input and ion-checkbox.

Describe the Use Case

Associate form elements with a form, as per usual HTML forms.

Describe Preferred Solution

No response

Describe Alternatives

No response

Related Code

No response

Additional Information

No response

[brandyscarney]

Thanks for the issue! Could you please provide a use case for this?

[oliveryasuna]

Thanks for the issue! Could you please provide a use case for this?

The form attribute exists so developers can associate inputs not children of a form element. It is standard HTML.

[sean-perkins]

@oliveryasuna the team is hoping to understand what limitations or challenges you have with the existing implementation to evaluate if the suggested feature would solve that problem.

Ionic's components are not a 1:1 API with built-in HTML elements. Adding support for a form element to a web component using shadow dom would not associate the form control to the form and would result in no added benefit to developers. Form association for shadow dom is handled by ElementInternals which Ionic Framework is not able to support until v9 at the earliest, due to the supported browser versions (Safari v16.4). Ionic Framework supports the feature of form on ion-button to query and submit the closest form, which is a bit different that form control behavior with associating validity state and values.

If you can provide more information about what you are trying to accomplish, we can best evaluate how to offer workarounds or understand if it is resolved by what ElementInternals will offer.

Thanks!

[ionitron-bot[bot]]

Thanks for the issue! This issue is being closed due to the lack of a reply. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Thank you for using Ionic!