Solutions I’ve tried
- Proper way to submit netlify forms with SSR frameworks like svelte / sapper <— doesn’t apply. I’m using HTML forms
- Form Submissions Empty ← doesn’t apply. I have an empty payload
- Forms setup | Netlify Docs
Debug info
- site name:
priceless-swartz-c27cfd.netlify.app
Notes
- I followed the official steps to add an HTML form, including the hidden input field.
- but note that I’m statically deploying the site, meaning there’s no SSR.
- the index HTML contains the form and it matches the code.
- however, when i hit submit, the payload is empty. Screenshot below
Update: If you look at the code, every input has a disabled
form which gets set to true on form submission. Unfortunately, if i’m not mistaken, disabled fields are never submitted. Removing that behavior and it’s now working locally. Gonna deploy…
Update: yea the disabled fields were making the payload empty :doh:
Code
is below:
<Form
name="contact"
data-netlify="true"
method="POST"
onSubmit={handleSubmit}
action="/thanks"
>
<input type="hidden" name="form-name" value="contact" />
<label htmlFor="name">Name:</label>
<input
disabled={disabled}
type="text"
name="name"
autoComplete="name"
required
/>
<label htmlFor="email">Email:</label>
<input
disabled={disabled}
type="email"
name="email"
autoComplete="email"
required
/>
<label htmlFor="phone">Phone:</label>
<input
disabled={disabled}
type="tel"
name="phone"
autoComplete="tel"
maxLength={10}
minLength={10}
required
/>
<label htmlFor="message">Message:</label>
<textarea
disabled={disabled}
name="message"
autoComplete="off"
maxLength={1000}
minLength={10}
required
></textarea>
<input type="submit" value="Contact us!" />
</Form>