Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Modal Dialog background overlay missing


we are using an igDialog in our MVC application. We are using it as modal dialog and want to have a background overlay to avoid usage of page controls. 

Unfortunately, it is not appearing. The dialog opens but the page is still accessible. However, as soon as we are clicking into the dialog, the background overlay appears. 

is this behavior expected? We want the overlay to appear as soon as the dialog opens... 

Thank you, 

P.S. some code:

 var popId = 0;
let popups = [];
function openPopup(html) {
let id = 'popup' + popId++;
$('<div id="' + id + '" />').prependTo(document.body);
let popup = $('#' + id);
let config = {
state: 'open',
modal: true,
draggable: false,
resizable: false,
showCloseButton: false,
height: '400px',
width: '600px',
zIndex: 9988 + popId,
openAnimation: { effect: 'scale', duration: 'slow' },
closeAnimation: { effect: 'scale', duration: 'slow' },
closeOnEscape: true,
stateChanged: function (evt, ui) {
if (ui.action === 'close') {
let div = $('#' + ui.owner.element[0].id);
return true;
return false;