Nuxt 3 form submission not showing despite response of 200

Support
4

I finally got this working! I hope this helps someone else who might be having the same issues.

I followed what was on this post Nuxt 3 Contact Form Solution

But it still didn’t work for me because I was using form validation.

  • The ajax post does not work, you have to submit from the form.

  • @submit.prevent won’t work you have to have prevent default in your function

In the end here is the code that ended up working

    <form
      @submit="submitForm($event)"
      name="contact"
      method="POST"
      action="/thanks"
      data-netlify="true"
      netlify-honeypot="bot-field"
    >
      <input value="contact" name="form-name" type="hidden" />
      <p hidden>
        <label>Don’t fill this out: <input name="bot-field" /></label>
      </p>


const submitForm = async (e) => {
  const isFormCorrect = await v$.value.$validate();
  if (!isFormCorrect) {
    e.preventDefault();
  }
  return;
};
2 Likes