SharePoint create a wait message for long running tasks

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.

waitScreens

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:



//Additional Page Head

function waitMessage() {
window.parent.eval("window.waitDialog = SP.UI.ModalDialog.showWaitScreenWithNoClose('This should not take long.', '', 90, 450);");
}


We use this code in order to close the waiting screen after operation completion.

In the button definition we put the function call:



//Button call

<asp:button ID="btnSearch" runat="server" Text="Search" OnClick="btnSearch_Click" OnClientClick="javascript:waitMessage();"></asp:button>


And in the event function of the button “btnSearch_click” we put the following script after the operation is completed:



//Button Event

this.ClientScript.RegisterStartupScript(this.GetType(), "CloseWaitDialog", @"
<script language='javascript'>
if (window.frameElement != null) {
if (window.parent.waitDialog != null) {
window.parent.waitDialog.close();
}
}
</script>");


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 ::..

 

The article or information provided here represents completely my own personal view & thought. It is recommended to test the content or scripts of the site in the lab, before making use in the production environment & use it completely at your own risk. The articles, scripts, suggestions or tricks published on the site are provided AS-IS with no warranties or guarantees and confers no rights.

Karsten Pohnke About Karsten Pohnke
He is Consultant for SharePoint Solutions for collaboration, communication and business processes. He provides his customers applications based on standard features as well as development or combining the power of several microsoft tools like Dynamics CRM. In his free time he tries to collect tipps and worthy experience in this blog.

8 comments on “SharePoint create a wait message for long running tasks

  1. Ryan Hilliker

    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.

  2. 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);
    “);

  3. Pingback: Show a waiting message -working on it- for a long running process | SharePointing

  4. Can I use the same to show the “Please wait” kinda message to the user while CAML query is getting executed?

  5. 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

  6. Gaurav Jain

    // 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;
    }
    }

Submit comment

Allowed HTML tags: <a href="http://google.com">google</a> <strong>bold</strong> <em>emphasized</em> <code>code</code> <blockquote>
quote
</blockquote>

Please fill in the captcha: * Time limit is exhausted. Please reload CAPTCHA.