how to get the value of two p tag in react using useState in ReactJs

Question

I'm trying to get the value of two p tags at the same time to push those values to the backend.

my useState declaration const [isOffer, setIsOffer] = useState({ contractorName: "", newOffer: "" });

const handleChange = (e) => {
    const { name, value } = e.target;`

    setIsOffer({
      ...isOffer,
      [name]: value,
    });
  };

how I handle the form submission

  const handleFormSubmit = async (event) => {
    event.preventDefault();
    try {
      await approveOffer({
        variables: {isOffer, projectId },
      });
    } catch (err) {
      console.log(err);
    }
  };


<form className="flex-row justify-center justify-space-between-md align-stretch" 
 onSubmit={handleFormSubmit}>
<p
className="card-body"
name="contractorName"
value={offer.ContractorName}
onClick={handleChange}
>
Offer By:{offer.ContractorName}
 </p>
 <p name="newOffer"
 value={offer.newOffer}
 onClick={handleChange}
 >
 The Offer Value:{offer.newOffer}{" "}
 </p>
<button className="btn d-block w-100" type="submit">
 </form>

Answer 1

you will replace the handleChange code with the below code:

Existing:

const { name, value } = e.target;

Replace:

const name = e.target.getAttribute('name');
const value =  e.target.getAttribute('value');