Javascript - Form Submit not stopping

Question

I have a form I'm trying to stop users from double-submitting using javascript. For some reason,even when the handler function returns false and event.preventDefault are called, the form will still submit multiple times. Anyone know why? Also how do I make this work as intended?

document.getElementById('my_form').addEventListener("submit", function(evt){
    if ( validationFunction(document.getElementById('submit_button')) == false) {
        evt.preventDefault();
        return false;
    }
});

Function validationFunction(){ return false }

<form method="post" id="my_form">
  <input name='textbox'>
  <input type="submit" id="submit_button">
</form>

Answer 1

Try it in simple way. Like this

HTML

<form id="my_form">
<input name='textbox'>
<input type="button"  id="submit_btn">
</form>

JS

document.getElementById("submit_btn").addEventListener("click", function(){

document.getElementById("my_form").submit(); // if validation is true run this
});

Answer 2

document.getElementById('my_form').addEventListener("submit", function(evt){
  if ( validationFunction(document.getElementById('submit_button')) == false) {

        // anything here

        evt.preventDefault();
        return false;
    }

    // anything here

    event.preventDefault();
});