In SharePoint 2010 and 2013 you have the nice looking Modal dialogs. I wrote already some posts about it. But now i would like to share how you can use these for long running tasks. For example if you perform a search which may take some seconds, it would be nice to give a small message for the user to wait. These are called the showWaitScreen like in the picture below.
How we can implement such a cool message window? Let’s start with the scenario. We have a custom application page. In this page we have a search button and a grid in which we will load data. The data loading operation takes a few seconds. So we start implement our script.
In the Page Head section we add the following code:
[sourcecode language=”csharp”]
//Additional Page Head
function waitMessage() {
window.parent.eval(“window.waitDialog = SP.UI.ModalDialog.showWaitScreenWithNoClose(‘This should not take long.’, ”, 90, 450);”);
}
[/sourcecode]
We use this code in order to close the waiting screen after operation completion.
In the button definition we put the function call:
[sourcecode language=”csharp”]
//Button call
[/sourcecode]
And in the event function of the button “btnSearch_click” we put the following script after the operation is completed:
[sourcecode language=”csharp”]
//Button Event
this.ClientScript.RegisterStartupScript(this.GetType(), “CloseWaitDialog”, @”
“);
[/sourcecode]
This script will close the dialog or waiting message and the data is loaded and visible in the grid.
Hope this helps you, i like this cool function.
More Information can be found here.
..:: I LIKE SHAREPOINT ::..
Thanks a lot! I was struggling with closing the modal dialog while I’m learning HTML5/JavaScript/EMCA.
This was a great help and I appreciate the blog.
Thank you very much..
This helped me a lot
Your script to close the dialog not work, you could use this:
this.ClientScript.RegisterStartupScript(this.GetType(), “CloseWaitDialog”, @””
var someobject;
SP.UI.ModalDialog.commonModalDialogClose(1, someobject);
“);
Can I use the same to show the “Please wait” kinda message to the user while CAML query is getting executed?
Hi,
Thank your very much!
Do you think it is possible to implement that kind of waiting message in a Nintex form with javascript?
Thanks for your help
Trish
i am not sure about that, but maybe you can open a request at nintex itself? Let us know what they told you.
// false Off true On
function LoaingShowHide(OnOff)
{
if (OnOff && window.parent.waitDialog == null)
{
window.parent.eval(“window.waitDialog = SP.UI.ModalDialog.showWaitScreenWithNoClose(‘This should not take long.’, ”, 90, 450);”);
}
if (!OnOff && window.parent.waitDialog != null)
{
window.parent.waitDialog.close();
window.parent.waitDialog = null;
}
}