Modal Dialog works in content editor but not an .aspx page or .html page

<script type="text/javascript">

var options = {
 url: "linktoform.aspx",
    title: "Form Title Goes HERE",
    allowMaximize: true,
    showClose: true,
    width: 650,
    height: 600,
    dialogReturnValueCallback: silentCallback};
function open() {SP.UI.ModalDialog.showModalDialog(options);}
function silentCallback(dialogResult, returnValue) {
}
function refreshCallback(dialogResult, returnValue) {
  SP.UI.Notify.addNotification('Operation Successful!');
  SP.UI.ModalDialog.RefreshPage(SP.UI.DialogResult.OK);
}
</script>

<a href="javascript:open()"><img src="http://blog.oscarliang.net/wp-content/uploads/2014/07/Sharepoint-2013-Logo.png" alt=""/></a>

When I add this code to a content editor wp it works fine, modal opens up and functions perfect. but when I try to add to an apsx page or html page it does not work. I have my script in the <head> and my button in the <body> so I am not sure what  may be missing?

Has anyone added a modal dialog link to a custom aspx or html page?

May 20th, 2015 6:57pm

does your custom aspx/html file include references to the SharePoint javascript files? the files which provide the methods that you're wanting to use?
Free Windows Admin Tool Kit Click here and download it now
May 20th, 2015 8:02pm

Hi, yes I have tried adding all of the suggestions from this thread https://social.technet.microsoft.com/Forums/office/en-US/f0e487d1-bf4a-4e86-87f5-b3a61db2ecb7/issue-calling-spuimodaldialogshowmodaldialogoptions?forum=sharepointdevelopmentprevious&prof=required

<Sharepoint:ScriptLink ID="ScriptLink1" Name="sp.ui.dialog.js" Localizable="false" runat="server"></Sharepoint:ScriptLink>  
        <SharePoint:FormDigest runat="server" />

But I can an error for unknown script link. I have this code in the <head> of the page

May 21st, 2015 8:32am

I got it to work when I created the aspx page first from SharePoint not designer. The js files were included in the master page source. But I would like to know how to add these files for when I am creating custom aspx or html files, as the above code did not work.
Free Windows Admin Tool Kit Click here and download it now
May 21st, 2015 8:54am

so the error is now in the ScriptLink tag? did you include the necessary directives to define the SharePoint namespace with the ScriptLink tag?
May 21st, 2015 12:35pm

No I don't think so. this is the first time I have tried to add tags to a custom aspx page, so I believe those are missing. Do you have a code snippet I could follow for an example?
Free Windows Admin Tool Kit Click here and download it now
May 21st, 2015 12:41pm

Hi,

Please create a new .aspx page and copy the following code into the page in SharePoint.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@ Page Language="C#" %>
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">

    <head runat="server">
        <meta name="WebPartPageExpansion" content="full" />
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>
            Test Modal Dialog
        </title>

        <script type="text/javascript" src="/_layouts/microsoftajax.js"></script>
        <script type="text/javascript" src="/_layouts/1033/init.js"></script>
        <script type="text/javascript" src="/_layouts/sp.core.js"></script>
        <script type="text/javascript" src="/_layouts/ScriptResx.ashx?culture=en%2Dus&amp;name=SP%2ERes&amp"></script>
        <script type="text/javascript" src="/_layouts/sp.runtime.js"></script>
        <script type="text/javascript" src="/_layouts/sp.ui.dialog.js"></script>
        <script type="text/javascript" src="/_layouts/sp.js"></script>

        <link rel="stylesheet" type="text/css" href="/_layouts/1033/styles/Themable/corev4.css" />

        <script type="text/javascript">
            function OpenDialog() {
                var options = {
                    url: 'http://www.bing.com',
                    title: 'Test Modal Dialog',
                    width: 800,
                    height: 600,
                    dialogReturnValueCallback: CloseCallback
                };
                SP.UI.ModalDialog.showModalDialog(options);
            }

            function CloseCallback(result, returnValue) {
                //alert('Result from dialog was: ' + result);
                if (result == SP.UI.DialogResult.Ok) {
                    //alert('You clicked Ok');
                }
                else if (result == SP.UI.DialogResult.cancel) {
                    //alert('You clicked Cancel');
                }
            }
        </script>
    </head>
    <body>
        <a href="#" onclick="OpenDialog();">Test</a>
        <form id="form1" runat="server"></form>
    </body>
</html>

Best Regards,

Dennis

May 22nd, 2015 12:37am

This topic is archived. No further replies will be accepted.

Other recent topics Other recent topics