window.frameElement.commonModalDialogClose(); works in Chrome but not in Internet Explorer

Question

I have a site that opens a modal dialog within it when the site refreshes.

To close the modal dialogue via JavaScript I wrote

window.frameElement.commonModalDialogClose();

which works perfectly fine in Google Chrome, but nothing changes when I use Internet Explorer. The modal dialog still appears.

I've tried several other approaches, such as

window.frameElement.commitPopup('Closed with OK result');
window.frameElement.cancelPopUp();
SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.OK,"Test");
SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.cancel, 'Cancelled clicked');

but none of them seemed to work either.

I don't know what the issue is. Does someone know a solution to this?

Answer 1

According to SharePoint: How to close a Modal Dialog Window, under "Methods to close Modal Dialog Window" it states (emphasis mine)...

To close a Modal Dialog Window we can employ the methods shown below. Note that the methods become accessible through the window.frameElement after the dialog has been opened/created, in other words, SP Dialog framework extends the window.frameElement object by adding these custom methods.

I've regularly found that IE loads elements a lot slower than Chrome, so you may need to add a check for when the element loads.

Can you verify that the box will close if you manually enter window.frameElement.commonModalDialogClose(); into the f12 dev tools console within IE?

If it does, the following interval may be useful:

var commonDialogInterval = setInterval(function commonDialogCheck() {
    if( window.frameElement && window.frameElement.commonModalDialogClose ) {
        window.frameElement.commonModalDialogClose();
        clearInterval(commonDialogInterval);
    }
},50)

This should call the function once the dialog box loads, then clear the interval.