jQuery: BlockUI Plugin

Tweet

I recently needed to use AJAX requests and make the user aware of the fact that something was happening. If we use the classic XMLHttpRequest object in synchronous mode the entire web interface will freeze until the request is completed. You may understand that the user might be confused on what is going on in background, so we need to display simple and effective messages, explaining that the request is actually being sent and processed.

It is the usual "Please wait" issue, specifically needed when dealing with big amount of data. However, now we can benefit from the jQuery library and a great plugin: BlockUI
The plugin is really very simple to use and it has many features to explore. I started using it for easy operations, but after a while, I discovered different practical use of it.
According to the web site "The jQuery BlockUI plugin lets you simulate synchronous behavior when using AJAX, without locking the browser. When activated, it will prevent user activity with the page (or part of the page) until it is deactivated. BlockUI adds elements to the DOM to give it both the appearance and behavior of blocking user interaction."
The plugin size is 16 kb, which is not that bad considering what it can do. It has three main features which are:

1. complete page blocking;
2. element blocking;
3. and modal dialogs.

As explained in the demos page of BlockUI, you can use the plugin in different ways. Interesting are the login form and the image box, but as you can see, there are various situations where BlockUI might become handy.
Please do leave a comment if you wish.