We use cookies to ensure you have the best browsing experience on our website. Please read our cookie policy for more information about how we use cookies.
  1. Prepare
  2. React
  3. Forms
  4. Contact Form
  5. Discussions

Contact Form

Sort by

recency

|

14 Discussions

|

  • gogul_vijay_v
     + 0 comments

    const handleSubmit = (e) => { e.preventDefault();

    // Validate that none of the fields are empty if (!name.trim() || !email.trim() || !message.trim()) { setError("All fields are required."); setSubmittedData(null); // Clear submitted data if validation fails } else { setError(""); // Clear any existing errors setSubmittedData({ name, email, message });

    // Clear input fields after successful submission
setName("");
setEmail("");
setMessage("");

    } };

  • opal22fauzian
     + 1 comment
    const handleSubmit = (e) => {
e.preventDefault(); 

if ( !name || !email || !message ){

        setError( 'All fields are required.' );
        setSubmittedData('');

} else {

    // TODO: Add logic to validate inputs and display submitted data // HINT: You can use the setError function // HINT: You can use the setSubmittedData function as below

    setError('');
setSubmittedData({ name, email, message });
setName('');
setEmail('');
setMessage('');
}

    };

  • shamithnakka
     + 1 comment

    Here's my approach...

    const handleSubmit = (e) => {
  e.preventDefault();

  setError("");
  setName("");
  setEmail("");
  setMessage("");
  setSubmittedData(null);

  if(!name || !email || !message) {
    setError("All fields are required.");
    return;
  }

  setSubmittedData({ name, email, message });
};

    Let me know what you think...

  • avinash20c20
     + 0 comments
      const handleSubmit = (e) => {
    e.preventDefault();
    // TODO: Add logic to validate inputs and display submitted data
    // HINT: You can use the setError function

    // HINT: You can use the setSubmittedData function as below
    // setSubmittedData({ name, email, message });    
    if (!name || !email || !message) {
      setError("All fields are required.");
    } else {
      setSubmittedData({ name, email, message });
      setName("");
      setEmail("");
      setMessage("");
      setError(""); // Clear any existing error
    }
  };``

  • andarbekbarsukov
     + 0 comments

    If you're building a contact form in React and need legal advice on user privacy, a civil lawyer can help clarify your responsibilities. Just make sure to handle that user data securely!