Atlaskit: Custom form validation in modal dialog


I have a modal dialog with a form and I’ve added a custom validation function. However, when I submit the form my custom validation function is not being called. I’ve created a codesandbox to reproduce the issue: modal-container-custom (forked) - CodeSandbox . To see the problem, open the codesandbox link above, click the button to open the dialog, then submit without entering anything in the text field. You should get an alert indicating that my custom validation function fired but nothing happens. When I take the form out of the modal dialog, the custom validation works.

I’d appreciate any assistance that can be provided to get this working.

Thank you.

My advice would be to change the modal and disable chrome. This will remove the header and footer (incl. buttons).

This will allow you to implement your own submit button with custom validation. If valid, you call AP.dialog.close(data) to close the dialog and return the payload to your connect iframe.

1 Like

Awesome, thanks a lot. I have it working now based on your suggestions.