Can I prevent the submit button from being sent before loading the DOM?

Question

I am doing form validation with the jquery validate plugin. It works fine, however, if the DOM is not fully loaded and you click the "Submit" button, then the document ignores the check and goes to the page specified in the "action" attribute. Is it possible to prevent the submit button from being submitted before sending the DOM?

Answer 1

If you create a submit button like this:

<input type="submit" id="submit" value="submit" disabled="disabled"/> 

Then you can put this in your $(document).ready( right after the validation plugin is initialized:

 $("#submit").prop("disabled", false); 

Demo: http://jsfiddle.net/nZVrs/

Answer 2

You can initially select your forms with something like:

 <form ... onsubmit="return false;"> .... </form> 

Then, in JavaScript, change the onsubmit handlers of the forms that you want to activate when you are ready.

Answer 3

How exactly does anyone manage to submit a form before DOMContentLoaded gets fired? Just curious?

If we were talking about window.onload , then I would understand, because it may take some time for the page to fully load (especially if the content has not been cached before), but DOMContentLoaded ?

In most cases, it fires so fast after the page starts rendering, it is almost impossible to be so fast and submit the form.