How to submit @atlaskit/form remotely

Question

I want to submit a @atlaskit/form from the button outside the form. I have gone through https://atlaskit.atlassian.com/packages/core/form but no documentation regarding this

Answer 1

Warning: When trying to submit a form remotely, you would need to go out of your way to actually make the validation work. This is applicable to HTML forms, thus not limited by Atlaskit forms.

Read about it here:

• How to force a html5 form validation without submitting it via jQuery
• https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms/Form_validation

---

Answer:

Atlaskit form actually renders the native html form underneath. Therefore, we can attach a ref to the Form element and then trigger submit of the form property of the current ref.

Example:

// attach the ref to form
class extends React.Component{
 form = React.createRef(); 
 render() {
  <Form
   ref={this.form}
   {...props}      
  >
   {children}
  </Form>
 }
}

Trigger submit on html form:

this.form.current.form.submit()

See example codesandox here.