Question

I am using $.post to send a json structure built out of user input:

$.post(
    url1,
    {'input': JSON.stringify(input)},
    function(data) {
        if (data['status']) window.location.href = url2;
        else window.location.href = url1;
    }
);

A redirection always occurs after the post. My problem is that a browser seems to be inactive during the post and does not show any activity (i.e. loading progress) until the redirection starts, which results in circa 1 second when seemingly nothing is happening. By activity I just mean the standard ways of browsers to tell a user that it is loading a page (e.g. progress circle shown on my firefox tabs). Is there any way to invoke this standard behaviour as soon as the posting starts?

EDIT: Some people were asking why I don’t simply use the standard form submission. Well it is because the data I need to send are kinda complex to build and I don’t know if something like this can be done by standard (not-ajax) means. This is how I build the data:

var input = [];
$('.shopCat > p > input').each(function() {
      input.push({
        'id': $(this).closest('div').attr('id'),
        'name': $(this).val(),
        'parent': $(this).closest('div').attr('data-parent');
    });
});

Is it possible to build and post such data with a standard post form? (So i am actually asking two questions now.)

Answer 1

Well, you can’t force the browser to appear busy. But you can set the cursor to busy

$(document).css('cursor','wait');
$.post(
url1,
{'input': JSON.stringify(input)},
function(data) {
    if (data['status']) window.location.href = url2;
    else window.location.href = url1;

}
);

Although it might be better to not use ajax, just use normal form submission, since you chose to redirect afterwards anyways.