I'm loading a modal dialog on a web part. Sometimes it takes a lot of time to load, like 6/7 secs. Here's the code:

function Init(title, id) {

var dialogOptions = SP.UI.$create_DialogOptions();
dialogOptions.url = '/_layouts/MyWebPart/MyModalDialog.aspx?id='+id;
dialogOptions.title = "My Modal Dialog";
dialogOptions.width = 660;
dialogOptions.height = 400;
dialogOptions.dialogReturnValueCallback = function (res, retVal) {
    if (res === SP.UI.DialogResult.OK) {

return false;

Is there any way to show a message or a loading effect while MyModalDialog.aspx is not fully loaded?

2 Answers 2


asked somwhere else:

How do I show a loading div when opening a modal dialog from a CustomAction?

the accepted answer goes indepth with:

SP.UI.ModalDialog.showWaitScreenSize or SP.UI.ModalDialog.showWaitScreenWithNoClose.

or use:

<!-- within you site header -->
<script type="text/javascript">
/* display loader only if JavaScript is enabled, no JS-lib loaded at this point */
document.write('<div id="loader" style="display:table; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10000; background: #fff;">'
    + '<div style="display:table-cell; vertical-align:middle; text-align: center;">'
    + 'loading…<br /><img src="icon.load.gif" />'
    + '</div></div>');

<!-- at the bottom of you HTML (right before closing BODY-tag) -->
<script src="jquery.min.js"></script>
<script type="text/javascript">
/* hide the loading-message */

first part is for loading gif image (animated loading image)

second part waits for page to be fully loaded, once fully loaded it would fade out!.

You need to ammend to suit your needs:

takem from here:



You can use SP.UI.ModalDialog.showWaitScreenWithNoClose('Title here', 'Message here...'); to do just that.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.