SP.UI.ModalDialog.showModalDialog() not working in SharePoint 2013

Have you ever tried using SP.UI.ModalDialog.showModalDialog(options) in SharePoint 2013. I discovered some strange behavior…

After migrating my code from SharePoint 2010 to SharePoint 2013 the calls to showModalDialog failed with message that the method cannot be found (javascript). When checking it in IE Developer Tools this isn’t surprising at all. The required js-file isn’t loaded.

But why? I guess it must be the new SOD-Model (Script on Demand) that was introduced in SharePoint 2013.

SharePoint 2010 Example:

function ShowServerInformation() {
var options = {
url: '/_layouts/Management/GeneralInformation.aspx',
tite: 'Management Information',
allowMaximize: false,
showClose: true,
width: 430,
height: 230
};
SP.UI.ModalDialog.showModalDialog(options);
return false;
}

It’s very easy to fix this problem.

Follow below steps:

Remove the Java Script reference.
<script src="/_layouts/sp.js" type="text/javascript"></script>
<script src="/_layouts/SP.UI.Dialog.js" type="text/javascript"></script>
Add to the url variable "?IsDlg=1″`
Replace the command SP.UI.ModalDialog.showModalDialog() with the new command SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options);

After this few changes your solution will work correctly.

SharePoint 2013 Example:

function ShowServerInformation(featureId) {
var options = {
url: '/_layouts/Management/GeneralInformation.aspx?IsDlg=1',
tite: 'Management Information',
allowMaximize: false,
showClose: true,
width: 430,
height: 230
}
SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options);

return false;
}

Notice: I first tried the “executeOrDelayUntilScriptLoaded”-function. But it was not of much help. It just “swallowed” my function call but never executed it because the js-file I specified was never loaded.

You may like following SharePoint tutorials:

• SharePoint 2010 Javascript Examples
• Get internal names of fields from a list using JavaScript Object Model (jsom) in SharePoint
• Get last N days record from SharePoint list using the JavaScript
• Upload multiple attachments to list items using JSOM and REST API in SharePoint
• Display modal pop up in SharePoint Online/2013/2016
• Working with SharePoint Dialog Box various operations sample code
• Display web part page in a modal dialog box using JavaScript in SharePoint
• How to use _spPageContextInfo JavaScript variable in SharePoint

Here we learned how to fix error SP.UI.ModalDialog.showModalDialog() not working in SharePoint 2013.