When I hit enter on the form, it does not trigger the onSubmit event. There are no errors. The other event, onBlur, does dispatch. The logForm function will eventually console.log a JSON string of all the form's fields, but I have not yet gotten that far. I am simply trying to trigger the onSubmit event on the form. Any help or explanation would be appreciated. Here's the code:
import React from 'react'
export default function SignupForm() {
return (
<form onSubmit={logForm}>
<div className="form-group">
<label>
Name:
<input onBlur={logUpdate} className="form-control"
type="text" placeholder="Username"/>
</label>
</div>
<div className="form-group">
<label>
Email:
<input onBlur={logUpdate} className="form-control"
type="text" placeholder="johndoe@example.com"/>
</label>
</div>
<div className="form-group">
<label>
Password:
<input onBlur={logUpdate} className="form-control"
type="password" placeholder="Password"/>
</label>
</div>
<div className="form-group">
<label>
Confirm Password:
<input onBlur={logUpdate} className="form-control"
type="password" placeholder="Password"/>
</label>
</div>
</form>
)
}
function logForm(e) {
e.preventDefault()
const formInfo = new FormData(e.target)
console.log(formInfo)
}
function logUpdate(e) {
console.log(e.target.value)
}