Form Detection Not Working (Next.js SSR Mode)

Hi All,

I’m deploying a Next.js site to Netlify paired with the @netlify/plugin-nextjs plugin v 4.28.4
, and I’m trying to implement a sample Netlify forms based on the documentation. The build is successful, however Netlify doesnt seem to be getting picked up the form during the deployments.

Code:

          <form
            name="contact"
            method="POST"
            data-netlify="true"
            netlify-honeypot="bot-field"
          >
            <input type="hidden" name="form-name" value="contact" />
            <p>
              <label>
                Name <input type="text" name="name" />
              </label>
            </p>
            <p>
              <label>
                Email <input type="email" name="email" />
              </label>
            </p>
            <p>
              <button type="submit">Send</button>
            </p>
          </form>

Site name: Contact | Vanessa Victoria Wedding & Events

Am I incorrectly configuring something in the HTML markup? I’ve used identical code in a Gatsby site, which worked successfully, Is this Next.js specific? The site is running in SSR mode.

Any help is appreciated.

Thanks in advance!

Hi @lawnstuds, in case you have not read the Netlify blog post on how to add forms to your Next.js site, kindly follow the instructions in the blog post link below.

If you have already read the blog post shared or followed the instructions and you are still having problems, kindly let me know.

Hope this helps.
Thanks.

Hey @clarnx,

Thanks for this.

I’ve followed this doc with no luck. I’ve also made sure my form detection is enabled under Site Settings > Post Processing > Form Detection.

Am I still doing something wrong on my end?

Thanks,

Okay I think I found the issue, It appears that form detection does not work when using Next.js in SSR mode (getServerSideProps).

Is there any work around for this or is this just a limitation with Netlify?

Thanks,

Try: