PLEASE help us help you by writing a good post!
- Site:
profound-biscotti-10fc18.netlify.app
Forked netlify-templates/content-ops-starter: Netlify starter that’s made for customization with a flexible content model, component library, visual editing and Git Content Source.
For form submission I modified the FormBlock component to return the code below and I made sure my __forms.html existed and matched the form and input names.
I tried the code from here first: Using Netlify Forms with Next.js - OpenNext and that gave me a 400 Bad Request, missing form.
Then I tried the code from this post: Next JS 14.2.4 Form submissions - Support - Netlify Support Forums and it gave me a 500.
The form is detected but obviously there are no submissions. Form details | Forms | profound-biscotti-10fc18 | Netlify
@acpascal I’m not sure of the difference, (as I’ve not looked), but you should follow the instructions that you initially followed, as they’re the ones linked in the Netlify documentation under…
Limitations:
https://docs.netlify.com/frameworks/next-js/overview/#limitations
Form troubleshooting tips - Next.js Runtime v5 support
https://docs.netlify.com/forms/troubleshooting-tips/#next-js-runtime-v5-support
This documentation:
https://opennext.js.org/netlify/forms
Looking at what you have live currently, an issue you have is that it doesn’t conform to ‘Step 3’:
- In your dynamic page or form component, handle the submission by serving a
POST request to the static HTML file you’ve created above (using the example above: /__forms).
You need to POST to a static route, one that isn’t handled by Next.js
Currently you POST is pointed at your home page, which is being handled by Next.js
Adjust your code to match the documentation by doing the POST to __forms.
If it still doesn’t work, you should revisit all the steps, once followed correctly it will work.
I changed the code to POST to __forms.html and it started working.
Weirdly enough, I went back to the other code which was giving me a 400 and that was now working as well and I was no longer getting then 400 even though I didn’t change anything, I simply reverted the git commit history.
Solution was:
- Code exactly as in the post Next JS 14.2.4 Form submissions except I modified the POST to go to /__forms.html instead of /
Or,
- Code exactly as in the documentation (though it didn’t work at first).
Which isn’t that odd, as there are other factors at play.
Valuable information would have been where the 400 error was originating from (was it Next or Netlify).
You’ll also receive errors until you “Enable form detection” and “Perform a new rebuild/deploy” (even if no code changes). As it isn’t until Netlify detects the form that it allows submissions to it.
