Monday, October 15, 2012

Display animated spinner while loading modal dialog

The following javascript function SP.UI.ModalDialog.showModalDialog(options); is a way to display a modal dialog with specified dialog options. When you assign a value to the URL property of the dialog options, an IFRAME tag is rendered pointing to the appropriate URL.

ShowDialog example
var options = {
    title: "My Dialog Title",
    width: 400,
    height: 600,
    url: "/_layouts/DialogPage.aspx" };

To display an animated spinner, you can set a background-image for the iframe with some CSS.

    background-image: url("../images/animatedspinner.gif");        
    background-repeat: no-repeat;     
    background-position: 50% 50%; 


1 comment:

Ofer Gal said...

i GET JAVASCRIPT error in SP.js that type is undefined
What can be the issue?