Close modal popup opened using SP.UI.ModalDialog.ShowPopupDialog(url)

Question

Sharepoint promoted links webpart open in dialog opens the popup using SP.UI.ModalDialog.ShowPopupDialog(url)

How do I close this popup using a custom button in the popup page SP.UI.ModalDialog is null in the context of the page.

Answer 1

Try using commonModalDialogClose.

Create function to close popup or directly call method.

function CloseDlg() {
   SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.Cancel);
}

Or try to hide using class.

$('.CloseSPPopUp').click(function(){
   window.top.CloseSPUIPopoup();
});

function CloseSPUIPopoup{
   $(".ms-dlgContent").hide();
}

Use dialogReturnValueCallback option

var options = SP.UI.$create_DialogOptions();
    options.url = '/_layouts/mySolution/myPage.aspx';
    options.width = 500;
    options.height = 400;
    options.dialogReturnValueCallback = Function.createDelegate(null, CloseCallback);
    SP.UI.ModalDialog.showModalDialog(options);


function CloseCallback(result, target) {
    //Your code
}

Answer 2

Once I closed my modal in the following way

var closeLoading = function() {
    SP.SOD.executeFunc('sp.js', 'SP.ClientContext', function() {
        SP.UI.ModalDialog.commonModalDialogClose(1, 1);
    });
};

So write the following line of code in your button click handler.

SP.UI.ModalDialog.commonModalDialogClose(1, 1);

Answer 3

Here is my code for a custom button, in case it helps someone.

<input type="button" value="Cancel" name="gobackbutton2" onclick="SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.Cancel);" />