Question

I know that using .submit will trigger an event when the submit button is clicked. But I would like to trigger the event when the submit button have been clicked and the page reloaded (I think every page reloads after a form have been submitted).

This is an example:

    // Registration
$j("#register-form form").submit(function() {
          window.alert("submitted");
    $j("#registration-notification").animate({
            height: "21px",
            opacity: 1,
            'padding-top': "8px"
        }, 800 );
    return true;
});

    $j("#close-button").click( function() {
        $j("#registration-notification").animate({
          height: "0px",
          opacity: 0,
          'padding-top': "0px"
        }, 800 );
    });

with that code a notification appears, but the page immediately refreshes. What I want is to make the notification appear after the page refreshes).

Any suggestions to accomplish this?

Answer 1

Use a simple cookie to store when a page is submitted, and read that cookie on load and if it exists, show the notification and then delete the cookie.

EDIT: Sample solution, using jQuery Cookie plugin:

See the jsFiddle simple example here: http://jsfiddle.net/8952S/

This is a simple example, adapt it to your needs.

$(document).ready(function() {
    // check if user just submitted this page
    var justSubmitted = $.cookie('just_submitted');
    if (justSubmitted) {
        $("#registration-notification").show();
        // delete the cookie
        $.cookie('just_submitted', null);
    }

    // Registration
    $("form").submit(function() {
        // create a cookie, then let it submit normally
        $.cookie('just_submitted', 'true');
    });
});