Thanks for sharing!
I’ll try to take a look at in the future.

Anyway if somebody else reading can give a look and help find some inconsistency it would let me improve it, maybe other situation that it doesn’t actually cover.

http://javascript.nwbox.com/formsCop/

There are two versions, the oldest one (0.5) that I tweaked a bit to log information, and the newer one (0.8) that I am in the process of updating as soon as I find more misbehaviors / bugs.

Both will now log to Firebug console and window status, so enable “writing to status bar” in your browser if you want to see some info
or open the Firebug console.

–
Diego Perini

Sounds interesting.
However, this brings an extra dimension, that for one isn’t that good, to event delegation, just to solve a fairly small problem in a general way.

However, there are cases where it could indeed be proved useful, so please let me know about your solution when it is put together.

Just go through all the forms in the document and overwrite the “submit” methods to refer to the validator function. This must be done before “onload”.

If you want to cancel the “onsubmit”, capture the “onclick” event at the document level and cancel it’s “default action” by setting:

event.returnValue = false;

Trapping “mousedown” or “mouseup” will not work as with “onclick”.

I will soon post my “formsCop” in my lab site, I have actually revived it.

–
Diego Perini

Absolutely, using the HTMLFormElement is a great way to do it, but always leaves us with IE and how to solve it there. I don’t know of an equivalent workaround either.

Robert,
for W3C browsers that exposes this method it will be possible to prototype the HTMLFormElement, this could be a solution when having multiple forms to fix on the same page; no way to do that in IE that I know.

Your approach is definitely better. Override the submit to do what you want,k such as validation, and then perform a call, through a saved reference, to the native method.

Milo,

Very true and very interesting. I mean, I agree, that’s life, but since this is apparently intentional behavior, I would really like to learn the mindset behind it.

Phil,

Hope it helps!

Andy,

Well, that is clever, but it takes for granted that a onsubmit event has been applied; therefore, a check should be first if any event handler exists. And, what happens if you have multiple event handlers? (just talking and thinking, without actually testing now )

Even weirder was the fact that I was using an object that I’d called validator and its method validate() as in Simon Proctor’s comment. If I’d just read this post a day earlier I’d have had no problem!

I do like the idea of hijacking the form.submit() function to include the validation. It seems less obtrusive than just ensuring you validate before you submit, which was the solution I finished with yesterday.

Event handlers simply don’t fire unless the User performs the action. C’est la vie.

The problem is that I don’t think with __doPostBack you may want to call your form validation. The __doPostBack function may be called to retrieve some information, fill in a list, … Is there a way to know if __doPostBack is doing the final submit, which is where you would want to do your validation?