'JavaScript modal dialog without user interaction that can't be closed

I have a page where the user can update a form by clicking on the name of an entity. Think of a list of names, and the form with all the other fields (address, age, gender, etc.) updating with AJAX from the onClick. How do create a modal dialog ("Please wait.") that prevents user interaction until the AJAX call has returned data? I don't want the user to be able to click an X or Close button. They must wait!



Solution 1:[1]

var d = document.createElement('div');
d.style.position = "fixed";
d.style.top = d.style.left = d.style.right = d.style.bottom = "0px";
document.body.appendChild(d);

That's the basic mask. After that you can add more stuff like a "please wait" box.

Solution 2:[2]

You need to put a DIV over the entire contents of the page. Typically this is translucent to indicate that the user must wait. Sometimes there is a "loading" spinner on the overlay.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Niet the Dark Absol
Solution 2 Diodeus - James MacFarlane