BlockUI takes too long to block jQuery dialog

Question

I'm trying to use the jQuery BlockUI Plugin to block a jQuery dialog while it performs a sorting algorithm. The function that sorts works like this:

doSort : function() {
    $("#sort_dlg").block();

    // sort... takes a few seconds

    $("#sort_dlg").unblock();
}

It works, kind of. The dialog doesn't get blocked until AFTER the sort finishes. (The sort is all done locally, there is no AJAX call or anything.) How do I get it to block BEFORE the sort?

I tried moving the block() call to the OK button method of the dialog:

$(function() {
    $("#sort_dlg").dialog({
        autoOpen: false,
        bgiframe: true,
        modal: true,
        buttons: {
            "Cancel": function() { $(this).dialog("close"); },
            "OK": function() {
                $("#sort_dlg").block();
                doSort();
            }
        }
    });
});

But that didn't help. (I'm open to suggestions for blocking the UI using some other technique.)

Answer 1

as pointed by @Pandincus you can wait for some time to let blockUI complete its work and then start sort:

$(function() {
    $("#sort_dlg").dialog({
        autoOpen: false,
        bgiframe: true,
        modal: true,
        buttons: {
            "Cancel": function() { $(this).dialog("close"); },
            "OK": function() {
                $("#sort_dlg").block();
                //WAIT FOR 1 SECOND BEFORE STARTING SORTING
                setTimeout(function(){ doSort()}, 1000);
            }
        }
    });
});