JQuery Hide Form On Submit?

I have a form setup where a user can register, and on submittal, a PHP script runs which validates the user, and once that is done, it echoes a messagebox which jQuery quickly hide

Solution 1:

I think the reason it may not work is because the form is submitting it's data and waiting for page to refresh... which means, it will stop all of it's javascript stuff coz it's pointless ... I could be wrong but hey, your hide would take 1 second to hide but your page could reload quicker.

$(document).ready(function() {
    $('div.mainsuccess,div.mainerror').hide(0).fadeIn(1000);
    $('form.register').submit(function(e) {
        e.preventDefault();// will stop the form being submited...
        $(this).hide(1000);
        // do ajax here...
        return false;
    });
});

Updated

here is a list of tutorials

http://viralpatel.net/blogs/2009/04/jquery-ajax-tutorial-example-ajax-jquery-development.html

http://www.devirtuoso.com/2009/07/beginners-guide-to-using-ajax-with-jquery/

http://www.sitepoint.com/ajax-jquery/

Videos .... http://www.youtube.com/watch?v=0CMTQtnZ0G0

Solution 2:

Try this:

$("form").submit(function(e){
    e.preventDefault();
    $(this).hide(1000);
});

Solution 3:

You'd want to incorporate an ajax call (I'm taking post) to call the php instead of reloading the page

$('form.register').submit(function(e) {
    e.preventDefault();
    url = $(this).attr('action');
    $.post(url,$(this).serialize(), function(data) {
        alert('success');
        // data will return source code of the URL so you can grab that data and put it somewhere on the script like so.
        $('#result').html($(data).find('form'));//form can be replaced with anything
        // #result is the id of an element you wish to return the info to 
    });
    $(this).hide(1000);
});

And you'd be done.

More info here

Solution 4:

Well, seems that the form refreshes after submission, so it is still there.

I suggest using something like jQuery form: http://jquery.malsup.com/form/

Read up on it and you will find how to use it, and when it is submitted, it won't refresh, and using hide() you will be able to hide it.

N.B you will need jQuery referenced in your code to use jQuery form.

Enjoy.