Question

I am not new to programming, but kind of rusty in Javascript/web development. I am building an application with Rails, and we have several time-consuming operations during which we want to provide feedback to the user. Basically, I want to do something like this using AJAX:

1. [User clicks ‘ok’ or ‘proceed’]
2. [Optional confirmation box]
3. Show a status message saying “Working…” while the operation takes place
4. When the operation finishes and data returns from the server, status message changes to “Done!” and the results are rendered or some callback occurs.

It has been a while since I did web development, and a simple example of how to achieve something like this would be very helpful. Thank you.

Answer 1

$(window).ajaxStart(function() {
    $("#loader").show();
}).ajaxStop(function() {
    $("#loader").hide();
});

Just globally bind to start and stop. This example shows and hides a loader div. Generally you have a div with a spinner in it letting the user know that it is loading.

The disappearance of the spinner should be enough, a “done” message is overkill.