Ionic Framework 4.x React IonButton form attribute

Ionic Framework
1

Hey everyone,
i don’t think that there is a way to easily call a submit outside a form so i thought you might have some suggestions…

Example 1

<form id='test-form' onSubmit={ (e) => handleSubmit(e) }>
  <IonComponents>....</IonComponents>
</form>
<IonButton type='submit' form='test-form'>Submit</IonButton>

Doesn’t work/won’t comple since IonButton has no Attribute form, but

Example 2

<form id='test-form' onSubmit={ (e) => handleSubmit(e) }>
  <IonComponents>....</IonComponents>
</form>
<button type='submit' form='test-form'>Submit</button>

Example 2 also checks for form validation, which i wont get just calling the handleSubmit function.

The examples above are extremely simplified examples, but they work when i put the IonButton inside the form like this (form validation etc…:):

<form id='test-form' onSubmit={ (e) => handleSubmit(e) }>
  <IonComponents>....</IonComponents>
  <IonButton type='submit' form='test-form'>Submit</IonButton>
</form>

Any help is appreciated

2

I don’t have any suggestion, but there is an open feature request: https://github.com/ionic-team/ionic/issues/21194