Forms not working with gridsome

Hi @jen

I’ve figured it out (partly) eureka!

I believe that the code that I’ve used from the gridsome website doesn’t handle only one array element well. I say that as when I add in the below it works fine.

<label for="name" class="block mb-2 text-copy-primary"></label>
            <input
              type="hidden"
              name="name"
              v-model="formData.name"
              id="name"
              placeholder="New Subscriber"
              class="flex-1 bg-background-form rounded sm:rounded-r-none px-4 py-4 leading-normal border border-border-color-primary sm:border-r-0 shadow outline-none focus:border-ink-400 z-10 mr-2"
              required
            />

I suspect the reason for this is the use of a spread opperator …this.formData as I beleive thats saying “and passing in all the other array elements into this.encode”. Endone(data) has a .join(’&’) meaning its appending an & at the end of every array ellement. I suspect this combination of single field forms + spread opperator + .join is not working. At least this is my understanding of the code.

I suspect removing the spread and join for now would fix it in a more elegant way, but my “hacky bodge” of pushing a hidden name field works so I don’t want to spend more time on it.

The other theory I have is that netlify needs a minimum of 2 fields to process a form.

Testing is incredibly painful on netlift forms as you have to redeploy over and over again, which takes forever and is sole destroying.

I have added this post for the following reasons

  1. To help anyone else who might have similar issues does need to waste weeks and weeks of time.
  2. So that anyone smarter or with more time than me can 100% confirm the exact problem, why and an elegant fix.
  3. So that gridsome and/or netlify might be able to make a small improvement to either their code docs or if netlift, their form system (depending on item 2 above)
  4. As I wonder if there might be a faster and easier way for devs to debug netlifty forms in a more practical local host way.

Anyway, for now Im happy its working!

Fingers crossed you figure out the exact issues and can help make a better fix.

Thanks everyone who helped me on this thread and if you read this cos its issue for you too - good luck!

Cheers

Allan

2 Likes