How to create function for providing before/after submit event in JavaScript based on jQuery?
<p>First, I love a concept of jQuery about handler event. Please look at the following code.</p>

<pre><code>$('#someid').submit(function()
{
    // some logic for checking input data before submit
    return isValid($(this));
});
</code></pre>

<p>But I have some problem when I try to create some indicator for displaying submit process. Because jQuery has not any function like before/after xxx event. So, it’s impossible to create some process like the following diagram.</p>

<p><a href="http://cid-f093f24662880947.skydrive.live.com/self.aspx/StackOverFlow/flow.PNG" rel="nofollow"><img src="http://qmv6sa.bay.livefilestore.com/y1pybXwRr2DP061WcFlJCQppOJnwmSvT%5FCBcON53vyKJ-bvmQAMd6npqOm9VjorNRoqY2eUYt9mVCtEL%5FHArowjUtWRVEnwFu4J/flow.PNG" alt="Flow Diagram" /></a></p>

<p>Although it’s possible to create the above diagram, but in real-world application 3 functions in different events do not know each other. So, it’s impossible to create some function like the following code.</p>

<pre><code>function form_submit()
{
    if(isValid($(this)))
    {
        // send form data via AJAX/POST
        submitForm($(this));

        // display animation
        displayAnimation();
    }
    else
    {
        displayError();
    }
}
</code></pre>

<p>Do you have any idea for solving this question?</p>

<p><strong>Update#1</strong></p>

<p>I like some thing like the following code.</p>

<pre><code>// Before Submit function will receive function as parameter. If some function return false this submit will not be submitted.
$('#form1').beforeSubmit(function()
{
    return isValid($(this));
});

// So, I can create custom submit function for posting data via AJAX or any protocal.
$('#form1').submit(function()
{
    var serializedData = serializeForm($(this));
    $.postForm($(this), serializedData);

    $(this).afterSubmit();
    return false;
}

// After that, I can display animation for showing form process.
$('#form1').afterSubmit(function()
{
    displayAnimation($(this));
}
</code></pre>
