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

manasa sharma
manasa sharma
380 Points

how do i alter the event Handler when form is submitted

i see that click action is perfomed on the submit button what should i think next

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>

1 Answer

Jonathan Dewitt
Jonathan Dewitt
8,101 Points

If you just want to stop the default form submission so you can hook in your own functionality, you want to use preventDefault();

submitButton.addEventListener('click', (e) => {
    e.preventDefault();
    // your custom actions
});
Theo VOGLIMACCI
Theo VOGLIMACCI
8,027 Points

Well thanks i forgot that haha :-)