# Page Not Found on Netlify Form

**URL:** <https://answers.netlify.com/t/page-not-found-on-netlify-form/69670>\
**Category:** Support\
**Tags:** netlify-forms\
**Created:** [June 26, 2022, 6:40pm UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670 "2022-06-26T18:40:34Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![frizzyyy0](https://avatars.discourse-cdn.com/v4/letter/f/f17d59/32.png) [@frizzyyy0](https://answers.netlify.com/u/frizzyyy0)\
**Post date:** [June 26, 2022, 6:40pm UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670/1 "2022-06-26T18:40:34Z")

</div>

```auto
<form name="contactv1" method="POST" data-netlify="true" onSubmit="submit">
                <input type="hidden" name="form-name" value="contactv1" />

                <div>
                    <label>First Name:<br/>
                        <input type="text" name="first-name"/>
                    </label>
                </div>

                <div>
                    <label htmlFor="email" >Email:</label><br/>
                    <input id="email" type="email" name="email"/>
                  
                </div>

                <button type="submit">Submit the results</button>
            </form>
   

```

This code gives me a “Page Not Found” when run on my website and submitting the form. Not sure why as it’s a copy and paste from the example code + it passes all the tests in the support article for forms.

---

<div class="post-metadata">

**Author:** ![hrishikesh](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/hrishikesh/32/74607_2.png) [@hrishikesh](https://answers.netlify.com/u/hrishikesh)\
**Post date:** [June 26, 2022, 7:45pm UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670/2 "2022-06-26T19:45:38Z")

</div>

Please share the page where the form is active for anyone to be able to check.

---

<div class="post-metadata">

**Author:** ![frizzyyy0](https://avatars.discourse-cdn.com/v4/letter/f/f17d59/32.png) [@frizzyyy0](https://answers.netlify.com/u/frizzyyy0)\
**Post date:** [June 27, 2022, 7:11am UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670/3 "2022-06-27T07:11:52Z")

</div>

> **[Beowulf](https://johnny1.netlify.app/challenge)**
>
> The hunt commences soon.

I’ve edited the website quite a bit so you guys can see, so sorry if there’s any bugs or anything.

---

<div class="post-metadata">

**Author:** ![tomrutgers](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/tomrutgers/32/107_2.png) [@tomrutgers](https://answers.netlify.com/u/tomrutgers)\
**Post date:** [June 27, 2022, 1:55pm UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670/4 "2022-06-27T13:55:36Z")

</div>

You can find a pretty elaborate guide on implementing Netlify forms in React here:

> **[How to Integrate Netlify’s Form Handling in a React App](https://www.netlify.com/blog/2017/07/20/how-to-integrate-netlifys-form-handling-in-a-react-app/)**
>
> Netlify comes with some handy, built-in features to process form submissions without having to write any server-side code. Learn how to integrate them in your React app.

---

<div class="post-metadata">

**Author:** ![frizzyyy0](https://avatars.discourse-cdn.com/v4/letter/f/f17d59/32.png) [@frizzyyy0](https://answers.netlify.com/u/frizzyyy0)\
**Post date:** [June 27, 2022, 4:11pm UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670/5 "2022-06-27T16:11:48Z")

</div>

Hi, that didn’t help me either

---

<div class="post-metadata">

**Author:** ![perry](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/perry/32/16_2.png) [@perry](https://answers.netlify.com/u/perry)\
**Post date:** [June 27, 2022, 4:14pm UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670/6 "2022-06-27T16:14:42Z")

</div>

Hiya, sorry you are having trouble getting your forms to work.

[This Support Guide](https://answers.netlify.com/t/support-guide-debugging-support-and-help-for-netlify-forms-start-here/49479) is the first port of call to debug any forms issues. Please start here and work through these resources!

We also recommend trying to search the forums or look at topics tagged [Netlify forms](https://answers.netlify.com/tags/netlify-forms) if you haven’t already - it’s likely your question was already asked by someone else!

If you are still having problems, please provide more information such as what you have already tried, and a link to your live form. 🙂

---

<div class="post-metadata">

**Author:** ![frizzyyy0](https://avatars.discourse-cdn.com/v4/letter/f/f17d59/32.png) [@frizzyyy0](https://answers.netlify.com/u/frizzyyy0)\
**Post date:** [June 27, 2022, 4:15pm UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670/7 "2022-06-27T16:15:56Z")

</div>

That didn’t help either. Could someone actually look at what I’ve sent as i specified the guide didn’t help.

---

<div class="post-metadata">

**Author:** ![perry](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/perry/32/16_2.png) [@perry](https://answers.netlify.com/u/perry)\
**Post date:** [June 30, 2022, 4:39pm UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670/8 "2022-06-30T16:39:37Z")

</div>

there are many suggestions in that doc, and we’ve also asked that you tell us exactly what you have tried, and provide us a link to your live form.

Can you provide a screenshot showing us that your form is actually being processed?

We can be more helpful if you try to work with us, please.

---

<div class="post-metadata">

**Author:** ![frizzyyy0](https://avatars.discourse-cdn.com/v4/letter/f/f17d59/32.png) [@frizzyyy0](https://answers.netlify.com/u/frizzyyy0)\
**Post date:** [June 30, 2022, 4:49pm UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670/9 "2022-06-30T16:49:40Z")

</div>

Here is a link to the form

> **[Beowulf](https://kaleidoscopic-clafoutis-cbf1e1.netlify.app/challenge)**
>
> The hunt commences soon.

It’s a wordle game, you can just spam 6 answers in and get them all wrong, and should prompt a form (sorry for it being like that, I’ll sort it and make it easier to test later).

I changed the form style to:

```auto

    const [name,setName] = useState('');
    const [status,setStatus] = useState('');
    const [email,setEmail] = useState('');
    const [message,setMessage] = useState('');
    const [file, setFile] = useState({});
  
    const onDrop = useCallback(acceptedFiles => {
      console.log(acceptedFiles)
      setFile(acceptedFiles[0])
    }, [])
    const {getRootProps, getInputProps, isDragActive} = useDropzone({onDrop})
  
    const encode = (data) => {
      const formData = new FormData();
      Object.keys(data).forEach((k)=>{
        formData.append(k,data[k])
      });
      return formData
    }
  
    const handleSubmit = e => {
      const data = { "form-name": "contact", name, email, message, file }
      
      fetch("/", {
        method: "POST",
        // headers: { "Content-Type": 'multipart/form-data; boundary=random' },
        body: encode(data)
      })
        .then(() => setStatus("Form Submission Successful!!"))
        .catch(error => setStatus("Form Submission Failed!"));
  
      e.preventDefault();
    };
  
    const handleChange = e => {
      const {name, value} = e.target
      if (name === 'name' ){
        return setName(value)
      }
      if (name === 'email' ){
        return setEmail(value)
      }
      if (name === 'message' ){
        return setMessage(value)
      }
    }

    const { gameOver, correctWord } = useContext(AppContext)
    return (
        <div className="gameOver">
{/* 
            <p>{gameOver.guessedWord ? "Congratulations. You are worthy." : "Unlucky. You will be able to redeem yourself soon."}</p>
            <p>{gameOver.guessedWord ? "" : "Correct word: " + correctWord.toUpperCase()}</p>
         */}
 <form onSubmit={handleSubmit} action="/thank-you/">
          <p>
            <label>
              Your Name: <input type="text" name="name" value={name} onChange={handleChange} />
            </label>
          </p>
          <p>
            <label>
              Your Email: <input type="email" name="email" value={email} onChange={handleChange} />
            </label>
          </p>
          <p>
            <label>
              Message: <textarea name="message" value={message} onChange={handleChange} />
            </label>
          </p>
          <div {...getRootProps()}>
            <input {...getInputProps()} />
            {
              isDragActive ?
                <p>Drop the files here ...</p> :
                <p>Drag 'n' drop some files here, or click to select files</p>
            }
          </div>
          <p>
            <button type="submit">Send</button>
          </p>
        </form>
        </div>
    )

```

And as the screenshots show, I get a 404 response.

If the website is painful to use to see my problem, lmk and I’ll make some changes.

Thanks!

 ![image](https://global.discourse-cdn.com/netlify/original/3X/7/1/7166e3b9aa9da2e828ab1da1e18143dd3df1828f.png)

 ![image](https://global.discourse-cdn.com/netlify/original/3X/8/f/8f23836a2b4eeb81fdd44cebc90aabf26366a259.png)

---

<div class="post-metadata">

**Author:** ![frizzyyy0](https://avatars.discourse-cdn.com/v4/letter/f/f17d59/32.png) [@frizzyyy0](https://answers.netlify.com/u/frizzyyy0)\
**Post date:** [July 1, 2022, 5:47pm UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670/10 "2022-07-01T17:47:15Z")

</div>

Could I get some help on this ASAP?

Really need this done, had this problem for a week now thanks

---

<div class="post-metadata">

**Author:** ![tomrutgers](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/tomrutgers/32/107_2.png) [@tomrutgers](https://answers.netlify.com/u/tomrutgers)\
**Post date:** [July 1, 2022, 10:07pm UTC](https://answers.netlify.com/t/page-not-found-on-netlify-form/69670/11 "2022-07-01T22:07:54Z")

</div>

Your form should be present in your index.html, otherwise Netlify isn’t capable of detecting the form. It’s step #1 in the guide I sent you 4 days ago. I’m quite certain that’s the solution to your problem, as your current index.html does not include a form.