Code Snippet:
I have created a page and added the Script Editor Web Part.
  1. <script type="text/javascript">
  3. // Using the DialogOptions class
  4. function OpenDialog(strPageURL) {
  5. var dialogOptions = SP.UI.$create_DialogOptions();
  6. dialogOptions.url = strPageURL; // URL of the Page
  7. // Width of the Dialog
  8. dialogOptions.width = 800;
  9. // Height of the Dialog
  10. dialogOptions.height = 630;
  11. // Function to capture dialog closed event
  12. //dialogReturnValueCallback - A function pointer that specifies the return callback function. The function takes two parameters, a dialogResult of type SP.UI.DialogResult Enumeration and a returnValue of type object that contains any data returned by the dialog.
  13. dialogOptions.dialogReturnValueCallback = Function.createDelegate(null, CloseCallback);
  14. // Open the Dialog
  15. SP.UI.ModalDialog.showModalDialog(dialogOptions);
  16. return false;
  17. }
  19. // Dialog close event capture function
  20. function CloseCallback(strReturnValue, target) {
  21. if (strReturnValue === SP.UI.DialogResult.OK) {
  23. }
  24. if (strReturnValue === SP.UI.DialogResult.cancel) {
  26. }
  27. }</script>
  28. <div><a onclick="return OpenDialog("https://c986.sharepoint.com/SitePages/Test.aspx");"
  29. href="https://c986.sharepoint.com/SitePages/Test.aspx">
  30. Click here to show Modal Dialog</a></div>
Result:
Reference:
https://msdn.microsoft.com/en-us/library/office/ff410058(v=office.14).aspx.