submit a form with mooTools, and have the forms inline onsubmit event fire...help

Im writing a class that replaces all input type="button" and input type="submit" in the document with a custom button, that is actually a span stuffed inside of an anchor tag, i've got everything written, and it all works, except the inline onsubmit event is not being fired when the form is submitted with a javascript.

Actually, even writing a static anchor tag

<a href="javascript:void(0)" onclick="document.FORMNAME.submit();">Submit</a>

will not fire the inline onsubmit event for the form, but <input type="submit" /> will fire the event...anyways there has to be a way to fire this onsubmit event with javascript.

Heres a snippet of what im working with:

click: function() {

    //get parent form
    var thisForm = this.getParent('form');

    //fire onsubmit event
    thisForm.fireEvent('submit'); //this doesnt work!

    //submit form...the event isn't fired here either!
    thisForm.submit();

}

anybody have any ideas? this class needs to need no configuration and there are some older sites using our cms system that we want to plug this into, and there are quite a few inline submit events on the forms we need to account for

Thanks

UPDATE,

I took the suggestion and came up with this:

if(this.getParent().onsubmit()) {
    this.getParent().submit();
}

works perfectly for evaluating the forms onsubmit event and submitting the form based on its output, but what if the function doesn't exist at all? Any ideas?

Solution

Firing submit on a form doesn't trigger it's inline onSubmit, this is default javascript behaviour (found this: http://www.codestore.net/store.nsf/unid/DOMM-4QS3RL/)

You can try calling onsubmit yourself though, this works for me:

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/mootools/1.3.1/mootools-yui-compressed.js"></script>
        <script type="text/javascript" charset="utf-8">
            window.addEvent('domready', function(e) {
               $$('span.submit').each(function(el) {
                  el.addEvent('click', function(e) {
                    this.getParent().onsubmit();
                  });
               });
            });
        </script>
    </head>
    <body>
        <form method="post" onsubmit="alert('hi');" class="form">
            <input type="text" value="test" />
            <span class="submit">Submit the form</span>
        </form>
    </body>
</html>