JavaScript DOM Scripting By Example Adding and Removing Names Using the submit Event

Using the submit Event

Alter the event handler on line 4 to run when the form is submitted, not just when the submit button has been clicked. Leave the callback function empty for now. I don't know what to do here.

app.js
const form = document.querySelector('form');
const submitButton = form.querySelector('[type=Submit]');

submitButton.addEventListener('click', () => {

});
index.html
<!DOCTYPE html>
<html>
<head>
  <title>Submit Event</title>
</head>
<body>
<form>
  <label>Name:</label>
  <input type="text" name="name">
  <input type="Submit" name="submit" value="Submit">
</form>
  <script src="app.js"></script>
</body>
</html>

2 Answers

Richard Sabando
Richard Sabando
Front End Web Development Techdegree Graduate 15,873 Points

This was the right code. Took me a while trying to alter it after I kept getting the error message: "you did not use event handler on form"

const form = document.querySelector('form');
const submitButton = form.querySelector('[type=Submit]');

form.addEventListener('submit', () => {

});
Michael Nicholas
Michael Nicholas
22,696 Points

Line 4 should read:

form.addEventListener('submit', () => {

You're adding the event listener to the form element instead of the submit button, and changing the event from 'click' to 'submit'.