I’m trying to submit a form from within a modal overlay, and I’m struggling to find the right approach for handling validation errors with Turbo.
I’m wrapping the form in a turbo-frame
tag so that I can gracefully hide the modal on a successful 200 response rather than letting the redirect swap out out the body. I have a Stimulus controller that hides my modal if the form receives a successful 200 response from the turbo:submit-end
event. This works great as long as the response is a 200 without validation errors.
But when the form response comes back with validation errors and unprocessable_entity
status, my new turbo -frame
tag with form validation errors is not swapped with the old form turbo-frame
. Of course, if I send back a 200 status it works, but in that case, my stimulus controller detects a successful response and hides the modal.
What would be a more sound approach for handling form error validation with Turbo from within a modal?