Form and Gatsby - 404 on submit

Hello, I’m trying to run the basic example for forms like stated in the docs.

It shows up in the dashboard, but when I click submit, it POSTs to the same url, and gets a 404. The form is here.

There’s nothing special about the html, so I can’t figure out why it doesn’t work

Do you try something like <form name="send-place" action="/send-place" method="POST" enctype="multipart/form-data"> ?

2 Likes

You can find a working, gatsby compatible version in the gatsby-starter-netlifycms repo

1 Like

thanks @zltnvrs! appreciate the help!

{/* The form-name hidden field is required to support form submissions without JavaScript */}

doesn’t appear in the docs…

Hi @anythingsomething , I just made a form submission on that page and I see it went through as expected. Are you still having trouble?

Also, the form-name is sent by default in html forms since we add it when we process the html form. You don’t need to provide a hidden attribute for it in those instances. If you use Javascript to submit the form then you can pass the value in to the submission using a hidden field, or you can just add it in your submission handler function, it’s up to you. We don’t have a specific case for it but it is in our javascript submission examples, like https://www.netlify.com/docs/form-handling/#spam-filtering and https://www.netlify.com/blog/2018/09/07/how-to-integrate-netlify-forms-in-a-vue-app/. And it’s also mentioned in our docs at https://www.netlify.com/docs/form-handling/#ajax-form-submissions under AJAX Submissions

Adding fixed the problem for me too. I’m not using JS. Only html.

2 Likes

Adding the hidden input worked for me too. I also have an html only form. I added the following:
<input type="hidden" name="form-name" value="contact" />

It would be great if this could make it into the docs.