I get this error "Uncaught The 3rd parameter is expected to be the HTML form element or the style selector of form"

Question

Hello how to send a Email from Email JS ? I do watch of a lot tutorial and reading the post same problem of mine from here.

My problem is I have a useState Hooks object

 const [send,setSend] = useState(
    {
      from_name: '',
      to_name: '',
      message: ''

    }
  )

and whenever i run this i get this error "Uncaught The 3rd parameter is expected to be the HTML form element or the style selector of form"

heres my Onclick event

const sendEmail = (e) => {
    e.preventDefault();
    console.log(form.current)
    emailjs.sendForm('Gmail', 'template_ctj1ylr', send, 'HygvBj57xmwzHyqWt')
      .then((result) => {
          console.log(result.text);
      }, (error) => {
          console.log(error.text);
      });
  };

heres my components code

return (
    <div>
      <label>from_name</label>
      <input type="text" name="from_name" 
      value={send.from_name}
      onChange={
        e=> setSend({...send, from_name: e.target.value})
      }
      />

      <label>to_name</label>
      <input type="email" name="to_name"
      value={send.to_name}
      onChange={
        e=> setSend({...send, to_name: e.target.value})
      } />

      <label>Message</label>
      <textarea name="message" 
      value={send.message}
      onChange={
        e=> setSend({...send, message: e.target.value})
      }
      />

      <Button onClick={

        sendEmail
      }>
        click me
      </Button>
      <input type="submit" value="Send" />
    </div>
  );

please do help me

Answer 1

That 3rd param should be a form type as the error explains. Please follow this react example of emailjs. It's same as yours. Instead of setting a state, use form and do the submission through it.