Use SharePoint 2013 "Working on it..." during ajax call

Question

I'm trying to use the SharePoint 2013 "Working on it..." during ajax call. This is the code:

function ShowWaitDialog() {
    SP.UI.ModalDialog.showWaitScreenWithNoClose(SP.Res.dialogLoading15);
}

function BuildTable() {
    ExecuteOrDelayUntilScriptLoaded(ShowWaitDialog, "sp.js");

    //Do something

    SP.UI.ModalDialog.close();
};

The animation loads but never closes becouse on SP.UI.ModalDialog.close() I get the error "Object doesn't support property or method 'close'".

But on https://msdn.microsoft.com/en-us/library/office/ff410259(v=office.14).aspx I see that the close method exists.

Some suggestions? Thank you

Please check the answer posted here, http://sharepoint.stackexchange.com/a/88925/47153 — Sriram, Sep 21 '15 at 10:40
Hello, I already found that thread and didn't worked for me. I get the same error "Object doesn't support property or method 'close'". — chenny, Sep 23 '15 at 13:29
I answered a similar question here. http://sharepoint.stackexchange.com/questions/156504/modal-dialog-window-ui-wont-load-before-code-behind/156659#156659 — MickB, Sep 24 '15 at 21:53

score 10 · Answer 1 · answered Sep 21 '15 at 07:49

10

You need to call close() on object returned from showWaitScreenWithNoClose(). This works for me:

var loading = SP.UI.ModalDialog.showWaitScreenWithNoClose(SP.Res.dialogLoading15);
loading.close();

answered Sep 21 '15 at 07:49

dstarkowski

1,932
11
22

Hello I already tried it, I get the same error "Object doesn't support property or method 'close'". – chenny Sep 23 '15 at 13:30

ECM4D · Accepted Answer · 2015-09-24T17:48:26.520

7

You call your method showWaitScreenWithNoClose using asyncronously with callback ExecuteOrDelayUntilScriptLoaded. If sp.js is not loaded, then closing event can fire before the wait dialog is showed.

Your code should look like this:

var waitDialog = null;

function BuildTable() {
    ExecuteOrDelayUntilScriptLoaded(function() {
        waitDialog = SP.UI.ModalDialog.showWaitScreenWithNoClose(SP.Res.dialogLoading15);

        // DO SOMETHING;
        DoSomeWorkUsingAjax(myCallBack)


    }, sp.js);
}

function myCallBack() {
    if (!fIsNullOrUndefined(waitDialog)) {
        waitDialog.close(SP.UI.DialogResult.OK);
        //or SP.UI.ModalDialog.close();
    }
}

edited Sep 24 '15 at 17:48

answered Sep 21 '15 at 07:54

ECM4D

1,962
12
24

Hello, in my situation in the DO SOMETHING part I've to call something like $.when(ajax1(), ajax2()).done(function() { CallAfterAjax(); });. In this situation where I've to call myCallBack method? Thank you – chenny Sep 23 '15 at 13:35
Try this `$.when(....).done(myCallBack); – ECM4D Sep 23 '15 at 14:05
Hello, I tried as you suggested but it didn't works. I debugged it with IE Developer Tools and Firebug putting a breakpoint inside myCallBack and it never has been called. Does it means that my Ajax call don't end? – chenny Sep 23 '15 at 14:47
I put function () { alert('Hello World'); } inside .done() and it shows. – chenny Sep 23 '15 at 14:50
Then try function () { myCallBack(); alert('Hello World'); } – ECM4D Sep 23 '15 at 18:51
Sorry, before when the debugger didn't passed for myCallBack was a my mistake. Now It's solved. Anyway on waitDialog.Close(SP.UI.DialogResult.OK); I've always the same error: "Object doesn't support property or method 'close'" – chenny Sep 24 '15 at 07:40
Wait a moment, I replaced Close(SP.UI.DialogResult.OK); with close(SP.UI.DialogResult.OK) and now it seems works! :O But I tried it a lot of time before and Always gave me that error... Thank you anyway – chenny Sep 24 '15 at 07:55
Sorry for my typo error that have misleaded you. I corrected the answer. I'm glad your code is working now. – ECM4D Sep 24 '15 at 17:49

Use SharePoint 2013 "Working on it..." during ajax call

2 Answers2