jquery call back function

Question

i have a form and it validates and submit successfully. all i want is to call back function as "success" when the form has successfully submitted. here is what i have so far but no luck:

$(document).ready(function() {
$("#form1").validate({
        rules: {

                email1: {// compound rule
                        required: true,
                        email: true                 
                }
)};
$('#form1').ajaxForm(function() { 
                alert("Thank you for your comment!"); 
                //document.getElementById("popup").innerHTML = "Thank You!!"
            }); 
    });

here is my form input:

<input name="email1" size="22" type="text"/>

any ideas is greatly appreciated!

---

thanks for your responses. its not working well for me as i am trying to display "success" in this dhtml fadeout effect: http://dhtmlpopups.webarticles.org/fade-effects.php

i am pretty much stuck going in circles trying to find a way for the alert(success) to print out in the fade out.

any ideas

Answer 1

You're getting an error 'ajaxForm is not a function'? Did you remember to add a script tag referencing the ajaxForm jquery plugin? You need this, AFTER your script tag referencing the main jquery file:

<script type="text/javascript" src="jquery.form.js"></script>

With src of course pointing to a real file. AjaxForm is not part of the jQuery core.

If that doesn't work, you could try substituting the $ jquery symbol with 'jQuery' (case sensitive!), to check if $ might be redefined in any of your other scripts.

Answer 2

I quickly browsed the API and found this. (tsk.. tsk)

Sorry, but always remember to browse the API. It will save you a lot of pain.

$('#form1').ajaxForm({
    success: function() {
        alert("Success!");
    }
});

Answer 3

Firstly, you'll need to submit via AJAX:

$("#form1").submit(function() {
  $(this).ajaxSubmit();
  return false;
});

See the docs.

Assuming you're already doing that, ajaxForm() (which only prepares it but doesn't submit it) can take any of the $.ajax options so:

$("#form1").ajaxForm({
  success: function() {
    alert("Thank you for your comment");
  }
});