Most of the web applications you see are complex ajax driven applications. There is almost always an asynchronous call to a web service to get data; and having received that data we go forward with whatever our requirement. But consider a simple page such as this:
This is a simple customer form which collects the customer personal details and credit card information. The form is useless. It needs vital data such as credit card types, titles, and, country values etc all available in the UI. But the catch here is we have to make api calls to the corresponding services to get it. But we'd have to wait to get the response from those three services.
This really stupid application is actually a mockup of what to expect in the real world. However, you may not agree. If your requirement ever runs on the same lines such as these, I assume you have the power to change the entire solution design. However, some ill-fated teams can't do anything to that regard. Hence we have something like this popup.
But, please don't consider this rationale to be the reason behind the pattern.
Below we have kind of solved the problem of the above form becoming congruent for user input with a button click. This is just to demostrate the idea. I am using jQuery for my ajax calls, and jsFiddle apis to load some mock data. The point is I should not be able to do anything until the whole form is loaded. In practical implementations what happens on button click usually happens when the web page loads...
You can find the crux of the loader pattern in the loadForm function.
