I'm having the same issue like in multiple other discussions:

Chrome: Cannot read property 'defaultDialogWidth' of undefined

Firefox: SP.Res is undefined

https://sharepoint.stackexchange.com/posts/76044 http://social.msdn.microsoft.com/Forums/sharepoint/en-US/bf1dc5ea-c045-48f6-b0cd-144d0ab7c1ce/spreshiddenbuttonvaluebeforedialog-is-null-or-not-an-object?forum=sharepointdevelopmentprevious http://chuvash.eu/2012/02/13/scriptresx-ashx-in-sharepoint/

I have tried various solutions posted online but none seem to work. Can anyone tell me which dependencies I'm missing? (I'm not using a masterpage)

I have the following code:

    function showTimeSheetLinesDialog(guid) {
        var options = {};
        options.width = 500;
        options.height = 640;
        //options.url = getQueryStringParameter('SPAppWebUrl') + '/Pages/TimeSheetLineDetail.aspx?guid=' + guid + '&json=' + $("#" + guid).attr('data-lines');
        options.title = 'Dialog title';
        options.allowMaximize = false;
        options.showClose = true;

        ExecuteOrDelayUntilScriptLoaded(SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options), "SP.js")
        //SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options);

        // parent.SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options);


And the following scripts loaded:

    <base target="_parent" />
    <script type="text/javascript" src="/_layouts/15/init.js"></script>
    <script type="text/javascript" src="../Scripts/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="/_layouts/15/MicrosoftAjax.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.runtime.debug.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.debug.js"></script>
    <script type="text/javascript" src="/_layouts/15/ps.debug.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.ui.dialog.js"></script>
    <script type="text/javascript" src="../Scripts/moment.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.init.js"></script>
    <script src="/_layouts/15/ScriptResx.ashx?culture=nb-no&name=SP.Res"></script>

    <link href="../Content/bootstrap.min.css" rel="stylesheet">
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">

    <script src="../Scripts/bootstrap.min.js"></script>
    <script src="../Scripts/Warning.js"></script>
  • 1
    If you try your code on-premise (or just not from a "Hosted App"), does it work then ? – Cameron Verhelst Mar 6 '14 at 9:22
  • I got it half to work by adding all the script files that were missing manually, I am still missing the style and stuff. However, I was wondering if it is possible to open a dialog on the page from the web part. If it's not I don't even have to bother to try and get it to work. – Glenn Vandamme Mar 6 '14 at 9:52
  • When you say script files, do you mean custom script files or the ones that should be there generated by SP ? I do believe it's possible to open a dialog from a webpart. In the end it's just a Javascript call (which makes me believe that it should be possible from App Hosted too). – Cameron Verhelst Mar 6 '14 at 9:54
  • Yes, adding ScriptResx.ashx?culture=en%2Dus&name=SP%2ERes and sp.core.js got me something that looks like a modal dialog (it loads the other page) but without any style (can't move it, isn't appearing on top of the page like it should, ..) and it appears inside the webpart only. I'm starting to wonder if I did the right thing by not using any masterpage for my webpart? – Glenn Vandamme Mar 6 '14 at 10:00
  • You should not have to use a master page for your webpart, put any style files into the style libary and deploy them together with the webpart. Have you registered the necessary JS through your webpart (not the ScriptResx) ? Check this post for details: social.msdn.microsoft.com/Forums/sharepoint/en-US/… – Cameron Verhelst Mar 6 '14 at 10:48

I eventually found the missing dependencies myself, incase anyone ever runs into the same problem, they are the following:

 <script type="text/javascript" src="/_layouts/15/ScriptResx.ashx?culture=en%2Dus&name=SP%2ERes"></script>

<script type="text/javascript">
    'use strict';

    // Set the style of the client web part page to be consistent with the host web.
    (function () {
        var hostUrl = '';
        if (document.URL.indexOf('?') != -1) {
            var params = document.URL.split('?')[1].split('&');
            for (var i = 0; i < params.length; i++) {
                var p = decodeURIComponent(params[i]);
                if (/^SPHostUrl=/i.test(p)) {
                    hostUrl = p.split('=')[1];
                    document.write('<link rel="stylesheet" href="' + hostUrl + '/_layouts/15/defaultcss.ashx" />');
        if (hostUrl == '') {
            document.write('<link rel="stylesheet" href="/_layouts/15/1033/styles/themable/corev15.css" />');

| improve this answer | |

Have you checked this link ?


It mentions this:

The web page that hosts your app must have the following:

<WebPartPages:AllowFraming ID="AllowFraming1" runat="server" />

| improve this answer | |
  • Although I didn't include this in my original post, I do have this in my web page. – Glenn Vandamme Mar 6 '14 at 11:10
  • I think the answer in this link is not correct, or is missing some key information. AllowFraming in the host page has nothing to do with the app dialog. – Christophe May 25 '14 at 2:22

Add _ribbon = new Object(); after sp.ui.dialog.js script loaded.


<script type="text/javascript" src="/_layouts/15/sp.ui.dialog.js"></script>

<script type="text/javascript">

    _ribbon = new Object();

| improve this answer | |

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.