title: Can't use FormData in UI material forms to fetch form field values
body: <p>I am just trying to post data from my UI-material form into backend.</p>
  <p>I am using react hooks here.</p>
  <p>Below is code that i am trying to do using simple fetch.</p>
  <pre><code>  const [name, setName] = useState ('');
    const [email_id, setEmail] = useState ('');
    const [subject, setSubject] = useState ('');
  
    const onSubmit = (e) =&gt; {
      e.preventDefault();
      const data = new FormData(e.target);
      console.log(data);
      fetch(&quot;http://127.0.0.1:8000/api/contact/&quot;, {
        method: &quot;POST&quot;,
        body: data,
      })
        .catch((error) =&gt; console.log(&quot;Request failed&quot;, error));
    }
  </code></pre>
  <p>This is the material UI form which i am using</p>
  <pre><code>&lt;form onSubmit={onSubmit}&gt;
              &lt;TextField
                autoComplete=&quot;new-password&quot;
                id=&quot;outlined-basic&quot;
                label=&quot;Full Name&quot;
                variant=&quot;outlined&quot;
                value={name}
                onChange={(e) =&gt; setName(e.target.value)}
                required
              /&gt;
              &lt;TextField
                id=&quot;outlined-basic&quot;
                label=&quot;Email Address&quot;
                variant=&quot;outlined&quot;
                autoComplete=&quot;new-password&quot;
                value={email_id}
                onChange={(e) =&gt; setEmail(e.target.value)}
                required
              /&gt;
              &lt;TextareaAutosize
                className=&quot;textbox&quot;
                aria-label=&quot;minimum height&quot;
                rowsMin={3}
                placeholder=&quot;Subject&quot;
                value={subject}
                onChange={(e) =&gt; setSubject(e.target.value)}
              /&gt;
              &lt;button&gt;Submit&lt;/button&gt;
            &lt;/form&gt;
  </code></pre>
  <p>While using with material UI form it gives me error that says</p>
  <pre><code>{&quot;name&quot;:[&quot;This field is required.&quot;],&quot;email_id&quot;:[&quot;This field is required.&quot;],&quot;subject&quot;:[&quot;This field is required.&quot;]}
  </code></pre>
  <p>When i use normal html form it works perfectly fine. But when i try to do the same with material-UI form it doesnt work.</p>
  <p>It will be really helpful if anyone can help.
  Thanks in advance.</p>