Monday 3 August 2015

Open SharePoint page in modal dialog and return value from modal dialog

To open the page in modal dialog in SharePoint we need to add the following code

On Page Load of the parent page add client click event to the button as follows on Page Load event code behind

btnAdd.OnClientClick = "return OpenModalDialog('" + SPContext.Current.Site.RootWeb.Url + "/SitePages/YourPopupPage.aspx');";

In the ascx page of the parent page add the following script

<script type="text/javascript">

    // function is used to open a page in SharePoint Modal Dialog
    function OpenModalDialog(url) {
        // In order to work with the dialog framework, we need to first create the dialog options
        var options = SP.UI.$create_DialogOptions();
        options.url = url; // URL of the Page
       
        options.showClose = true; // Display Close button
        options.allowMaximize = false; // block maximizing
        options.autoSize = true; // Resize as per page content
        options.dialogReturnValueCallback = Function.createDelegate(null, CloseCallback); // Function to capture dialog closed event
        SP.UI.ModalDialog.showModalDialog(options); // Call to open Modal Dialog with above settings
        return false;
    }

    function CloseCallback(result, target) {
        if (result === 1) {
            location.reload(true);
        }
    }

</script>


In the ascx page of the popup page add the following script

<script type="text/javascript">

    function CloseWindow() {
        window.frameElement.commonModalDialogClose(1, 1);
    }

</script>

On button submit click event in server side after applying the logic add the following code at the end

Page.ClientScript.RegisterStartupScript(this.GetType(), "PopupScript", "SP.UI.ModalDialog.commonModalDialogClose(1,1);", true);

On button cancel click event in sercer side add the following code to close the window

this.Page.ClientScript.RegisterStartupScript(this.GetType(), "PopupScript", "SP.UI.ModalDialog.commonModalDialogClose(0, 0);", true);

No comments:

Post a Comment