Not receiving any netlify form submissions

Support
1

Hello,

My website is pat-lim.com if that will help.
I’ve got a form on my next/react website and have set it up with a public/form.html.
Following netlify docs/blogs exactly, but I’ve got no submissions.

Here’s my form.html

<form name="contact" data-netlify="true" netlify-honeypot="bot-field" hidden>
    <input type="text" name="name" />
    <input type="email" name="email" />
    <textarea name="message"></textarea>
</form>

and my contact form

  const [formData, setFormData] = useState({
    name: '',
    email: '',
    message: ''
  });
  const [responseMessage, setResponseMessage] = useState('');
  const [loading, setLoading] = useState(false);

  const encode = (data) => {
    return Object.keys(data)
      .map(key => encodeURIComponent(key) + "=" + encodeURIComponent(data[key]))
      .join("&");
  }

  const handleSubmit = async (e) => {
    e.preventDefault();
    setLoading(true);
    setResponseMessage('');
  
    try {
        await fetch("/", {
            method: "POST",
            headers: { "Content-Type": "application/x-www-form-urlencoded" },
            body: encode({ "form-name": "contact", ...formData }),
        });
        setResponseMessage("I'll get back to you soon, cheers!");
    } catch (error) {
        setResponseMessage('Unable to send the message, please try again later.');
    } finally {
        setLoading(false);
        setFormData({
          name: '',
          email: '',
          message: ''
        });
    };
  };

  const handleChange = (e) => {
    setFormData({
      ...formData,
      [e.target.name]: e.target.value,
    });
  };

  return (
    <ContactFormWrapper
      name="contact"
      method="POST"
      onSubmit={handleSubmit}
    >
      <input type="hidden" name="form-name" value="contact" />
      <FormField>
        <Input
          type="text"
          id="name"
          name="name"
          placeholder=" "
          value={formData.name}
          onChange={handleChange}
          required
        />
        <Label htmlFor="name">Name</Label>
      </FormField>
      <FormField>
        <Input
          type="email"
          id="email"
          name="email"
          placeholder=" "
          value={formData.email}
          onChange={handleChange}
          required
        />
        <Label htmlFor="email">Email</Label>
      </FormField>
      <FormField>
        <TextArea
          id="message"
          name="message"
          placeholder=" "
          value={formData.message}
          onChange={handleChange}
          required
        />
        <Label htmlFor="message">Message</Label>
      </FormField>
      <SubmitContainer>
        {loading && <LoadingSpinner />}
        {responseMessage && <FormResponse>{responseMessage}</FormResponse>}
        <button type="submit">Submit</button>
      </SubmitContainer>
    </ContactFormWrapper>
  );
}
2

Fixed my issues using Classics | Netlify

1 Like