jQuery already submitted vs. being submitted

Question

Hey guys,

I'm working on a jQuery function that forwards form data to page without interfering with the normal submission. I can do it without any issues as long as I capture the submit using .submit(), but I would have to run my own validation on the data because it operates independently of the regular submission. Is there a way for jQuery (or any Javascript) to detect that form data has been posted and validated?

cheers, Mike

Edit:

Workflow looks like this:
1. User enters data
2. Clicks submit
3. Site runs validation and accepts input
4. Submits data to new page
5. jQuery function detects new data was submitted and accepted so it runs.

More Edits for Clarity

I think you guys are missing the issue. I know how to detect a form is being submited (which is fine and dandy)

This is NOT what I want:

    $(this).each(function(){
           $(this).submit(function(){
                *** Code ***
           }
       }

Suppose I have a validation script running independent of the code I am currently writing. How can I detect that this ran, and then go to the submit code above?

Answer 1

Use onsubmit="" on your <form> element, but return false. i.e.:

<form action="?" method="post" onsubmit="validate_and_submit(this);return false;">

The return false prevents the form from actually submitting so you can do stuff with AJAX.

Hope this helps!

Answer 2

EDIT: for the original clarification

If you want the server to only received validated data, then just make sure its not submitted to prior to the client-side validation occuring. You can do this with selectively calling event.preventDefault() based on the result of the validation.

$("#form").submit(function(event) {

     //some stuff
     if (validate(formdata) == false) { 
        event.preventDefault();
     } 

});

If you want a server to do the validation and submit to itself or another service, you should make that part of the server-side workflow. So it'd be like

1.) client submits to Service1

2.) Service1 validates

3.) Services1 submits to Service2 (such that service2 never receives code from elsewhere)

Answer 3

What you need is AJAX here . So make a XHR request that goes to your server and posts data . The server's response would now go to a callback function ( your jquery function ) . If the data was validated and fine , you proceed further , else you stop .
What you are trying to do is not possible via the normal HTTP POST request .