3

My client wants me to create a modal dialog that acts like a popup window. Can this be done? Here's the issue:

The visitor is editing some basic database data via a form in the original browser window/tab. When he gets to a specific form field and clicks in it to enter a value, a modal dialog should open. The visitor should then proceed through several 'sub-pages' within the modal dialog until he gets to the end of these sub-pages. The last sub-page should put the resulting data into the original form field, then close the modal dialog at the same time.

Is this even possible?

I have seen online references suggesting that one modal dialog can open another, basically 'stacking' two or more modal dialogs, but that's not desirable here ... and so far I have failed to find any reference that suggests that the content of several 'pages' can be loaded, one after another, into the same modal dialog.

Any help is greatly appreciated here. Thank you.

  • Did you try to use the SharePoint Modal Dialogs? Link:- msdn.microsoft.com/en-us/library/office/… – variable Mar 11 '14 at 11:25
  • You can open the first page in modal dialog and then redirect to 2nd page inside that same modal dialog using window.location.href=newurl. Also append IsDlg=1 to querystring to hide ribbon. – Unnie Mar 11 '14 at 12:42
1

Reference: Step by step example to create and open modal dialog in SharePoint

Add Content Editor webpart in the page and add the below code.

<script type="text/javascript">

//User Defined Function to Open Dialog Framework
function OpenDialog(strPageURL) 
{
  var dialogOptions = SP.UI.$create_DialogOptions();
  dialogOptions.url = strPageURL;// URL of the Page
  dialogOptions.width = 750; // Width of the Dialog
  dialogOptions.height = 500; // Height of the Dialog
  dialogOptions.dialogReturnValueCallback = Function.createDelegate( null, CloseCallback); // Function to capture dialog closed event
  SP.UI.ModalDialog.showModalDialog(dialogOptions); // Open the Dialog
  return false;
}

// Dialog close event capture function
function CloseCallback(strReturnValue, target) 
{
  if (strReturnValue === SP.UI.DialogResult.OK) // Perform action on Ok.
    {
   alert("User clicked Ok!");
    }
  if (strReturnValue === SP.UI.DialogResult.cancel) // Perform action on Cancel.
   {
   alert( "User clicked Cancel!");
   }
}

</script>

Now to open a page and provide link as:- (use your own URL)

<a href="/_layouts/settings.aspx" onclick="return OpenDialog('/_Layouts/settings.aspx');">Site Settings</a>

Suppose now you have an URL that takes user from step A to Z. Once you launch this URL in the modal dialog, I believe it will work as per your requirement. You can try this, hope it helps..

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.