Saucy Tango Food Order Form

Web Development Full-Stack
1

I’ve finished everything but when I click submit it’s not triggering the alert. Anything I’m Missing?

import React, { useState } from "react";

function FoodOrderForm() {
  const [name, setName] = useState('');
  const [phone, setPhone] = useState('');
  const [address, setAddress] = useState('');
  const [order, setOrder] = useState('');

  const handleSubmit = (e) => {
    e.preventDefault();
    return alert(
      `Your order was successful!

      Your order was ${order}.
      
      Please shoe your confirmation number for pickup.`
    );
    
  };
return (
  <form onSubmit={handleSubmit}>
    <label htmlFor="name">Name:</label>
    <input 
    id="name" 
    name="name"
    type="text"
    value={name} 
    onChange={(e) => setName(e.target.value)}/>
    <label htmlFor="phone">Phone:</label>
    <input 
    id="phone" 
    name="phone"
    type"text"
    value={phone}
    onChange={(e) => setPhone(e.target.value)}/>
    <label htmlFor="address">Address:</label>
    <input 
    id="address" 
    name="address"
    type="text"
    value={address}
    onChange={(e) => setAddress(e.target.value)}/>
    <label htmlFor="order">Order:</label>
    <input 
    id="order" 
    name="order"
    type="text"
    value={order}
    onChange={(e) => setOrder(e.target.value)}/>

    <button type="submit">Submit Order</button>
  </form>
);
}

export default FoodOrderForm;

Thanks!

2

works for me as soon as this line is deleted (typo and duplicate).

2 Likes
3

Thanks!! missed that mistake

1 Like