Vanilla javascript form validations, how to undo prevent default on submit

Question

I've tried so many different things that I eventually gave up and switched to jQuery, but for my peace of mind, how would I undo the eventHandler in this case? The current method I have now isn't working.

Front end New Profile Form Validations
var profileForm = document.forms[0];

profileForm.onsubmit = function processForm(eventHandler) {
eventHandler.preventDefault();
if {blah blah blah, my code
}else{
  profileForm.submit(function(eventHandler) {
    return false;
  });
}

duplicate of: http://stackoverflow.com/questions/8664486/javascript-code-to-stop-form-submission — albert, Mar 16 '16 at 22:58
Vanilla means no libraries like jQuery. If you want to undo `preventDefault()`, why not just remove that line? — Oriol, Mar 16 '16 at 23:02
One good thing to do would probably be to stop using the `.onsubmit` style of event attachment and use [`addEventListener()`](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener). Then you could use its companion `removeEventListener()`. Otherwise you can just `null` the `.onsubmit` — zero298, Mar 16 '16 at 23:14

score 2 · Answer 1 · answered Mar 17 '16 at 00:06

Either null the .onsubmit property of your form, or use .removeEventListener()

var form = document.getElementById("my-form"),
  button = document.getElementById("my-button"),
  text = document.getElementById("my-text");

function submitHandler(submitEvent) {
  alert("Stopping with value: " + text.value);
  submitEvent.preventDefault();
}

form.addEventListener("submit", submitHandler);

button.addEventListener("click", function() {
  form.removeEventListener("submit", submitHandler);
});

<form id="my-form">
  <input type="text" id="my-text" name="my-text">
  <input type="submit">
</form>

Vanilla javascript form validations, how to undo prevent default on submit

1 Answers1