Problem submitting a form with Nuxt3

Hi everyone, I’m using Nuxt3 and I’m using the Netlify form, but it’s not submitting even though I’m not getting any error messages.

Site name : sprightly-pika-e45d03

here my template code :

<form @submit.prevent="submitForm" name="contact-form" data-netlify-recaptcha="true" data-netlify="true" data-netlify-honeypot="bot-field">
    <input type="hidden" name="form-name" value="contact-form" />
        <input type="text" v-model="name" name="name" id="exampleInput7" placeholder="Nom, prénom">
        <input type="email" name="email" v-model="email" id="exampleInput8" placeholder="Email">
        <textarea name="message" v-model="message" id="exampleFormControlTextarea13" rows="5" placeholder="Message"></textarea>
    <div v-if="showPopup" id="popup" :class="{ 'opacity-100': showPopup, 'opacity-0': !showPopup }">
        <p v-if="isEmailSent">E-mail envoyé avec succès !</p>
        <p v-else>Erreur lors de l'envoi de l'e-mail.</p>
    <div data-netlify-recaptcha="true"></div>
    <button type="submit">Envoyer</button>

and here my method to submit the form :

methods: {
        createFormDataObj(data) {
            const formData = new FormData();
            for (const key of Object.keys(data)) {
                formData.append(key, data[key]);
            return formData;

        submitForm() {
            const data = {
                "form-name": "contact-form",
                "message": this.message
            fetch("/", {
                method: "POST",
                headers: { "Content-Type": "application/x-www-form-urlencoded" },
                body: new URLSearchParams(this.createFormDataObj(data)).toString()
                .then(() => {
                    this.isEmailSent = true;
           = "",
                    this.message = "",
                .catch(error => alert(error))

        showPopupFunc() {
            this.showPopup = true;
            setTimeout(() => {
            }, 3000);
        hidePopup() {
            this.showPopup = false;

During my fetch, I enter the “then” block and not the “catch” block, but when I go to my Netlify interface in the form section, no email is detected.

My form seems to be detected correctly by Netlify, but it is not retrieving any emails. Here is a screenshot of my dashboard in the “form” section, as well as the logs for the post-processing part.

Post processing logs :

12:11:18 PM: Starting post processing

12:11:18 PM: Post processing - HTML

12:11:18 PM: Processing form - contact-form

12:11:19 PM: Detected form fields:

  • name
  • email
  • message

12:11:19 PM: Post processing - header rules

12:11:19 PM: Post processing - redirect rules

12:11:19 PM: Post processing done

12:11:19 PM: Section completed: postprocessing

12:11:20 PM: Site is live :sparkles:

As of now, you seem to be getting submissions. Is this resolved?

Hello, yes, sorry, I forgot to post to let you know that it’s working now. However, I’m not entirely sure what changed. I did several deployments, and at some point, it started working. The only thing I modified was that I simply added an “action=”/success" to my form tag, and since then, it’s been working. I’m having a bit of trouble understanding why this small addition is responsible for making it work now. Originally, I added this for a redirection, but I’m using a pop-up system instead of a redirection. Anyway, it’s working, but I’m not quite sure how, so I apologize for anyone who might have the same problem as me.