Support Forums

Strange form issue - one form works, others wont work

Site name: Netlify App

Production site: https://floridabulldogshockey.com

I have forms that Netlify no longer seems to be picking up for my Gatsby-based site.

I have a contact form that works OK (About → Contact), but new forms that I have created and existing forms that I have renamed don’t seem to be getting recognized by Netlify.

I do have a working form, so I know what needs to be done to make them work (e.g. send form-name with encoded form values, include form-name hidden input tag) but the build logs are only picking up the contact form and I can’t figure out why.

I’m at a loss here… help please :slight_smile:

Hi @djben

Other than the above form (which you say works) I can’t find any other forms on your site. What page(s) are they on?

1 Like

There are a number of forms under ‘Resources’ but they require registration – it should be easy if you want to try, I have user login/database all wired up pretty well with Firebase. Once the form is filled out, I capture it in Netlify then take the callback response with the same form data and run an API query to a Netlify function in my app that creates a Paypal redirect URL which goes back to the browser.

The Netlify form support is ‘nice to have’ as I can just send the form data directly to my backend, but it is useful to have in my Netlify management UI and I like the email auto-forward baked in - it provides an extra layer of easy troubleshooting should I need it.

I will take https://floridabulldogshockey.com/tuition2021/10U as example here.

When visiting the page directly (in Chrome) or refresh I see this

However when I visit via a link from another page I see this

Now, to the form.

The HTML behind your form is this

There is only a CSS class. Once email and password are entered, the button is enabled. As I entered an incorrect username/password, I receive.

There is no user record corresponding to this identifier. The user may have been deleted.

This is not a Netlify form as there is no netlify attribute. This is all handled by a submit event listener that handles the AJAX post directly to a Google API endpoint. There is a submit event listener on the sign-up page too.

1 Like

I do have to figure out the issue with the first-render of the page not working correctly.

The sign-in form isn’t going through Netlify - this is just a requirement in order to be able to render another form.

I did figure out what is going on, though – Netlify cant crawl my form with the way the UI is built to first require the user to be authenticated.

I tweaked my form scheme to render the form regardless of user state, but added a CSS tag to hide it when the user is not logged in.

Thanks for checking it out! This is my first React site / Jamstack app.

As this is a Gatsby/React App do you have a catch-all rewrite?

/*    /index.html    200!

This will make any URL rewrite to index.html so that Gatsby/React can handle the routing. Check out Common Configurations in Netlify docs

If your app uses history pushstate to get clean URLs, you must add a rewrite rule to serve the index.html file no matter what URL the browser requests.

Another option is a Static Site Generator (SSG) rather than SPA.

As this is a Gatsby/React App do you have a catch-all rewrite?

I did not, but tonight I found and deployed gatsby-plugin-netlify after researching the 404 on first render error, which solved that problem as the plugin appears to be creating the necessary redirects to work with my client-side routes.

Thanks for your help! Hopefully this thread can help others if they come across form issues or this 404 issue.

1 Like