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>
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');