Revisions to Javascript iframe isn't running correctly

add more calirification

Source Link

edited Oct 4, 2016 at 22:08

45.4k
9
54
96

[Output]

the above code should show the current user .

So it's hit now onQuerySucceeded and can load SP.JS.

Note : the above code worked for me at ASPX Page . so you should match it with your code and make sure that the scriptbase variable is set to the correct path of your layout folder, if you face any other issue, you should check your code where the issue should not now be related to loading SP.JS

Note : the above code worked for me at ASPX Page . so you should match it with your code and make sure that the scriptbase variable is set to the correct path of your layout folder

[Output]

the above code should show the current user .

So it's hit now onQuerySucceeded and can load SP.JS.

Note : the above code worked for me at ASPX Page . so you should match it with your code and make sure that the scriptbase variable is set to the correct path of your layout folder, if you face any other issue, you should check your code where the issue should not now be related to loading SP.JS

add more calirification

Source Link

edited Oct 4, 2016 at 22:01

Mohamed El-Qassas MVP ♦

45.4k
9
54
96

So to use CSOM within IFrameexternal page , try to referenceyou should do the following scripts to your page within Iframe.:

Via SharePoint Designer , Add new ASPX Page

At Head Section add your code as the following

The final page sould looks like

<script<!DOCTYPE src="http:html PUBLIC "-//yoursiteW3C/_layouts/1033DTD XHTML 1.0 Strict/init/EN" "http://www.js"><w3.org/script>TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@ Page Language="C#" %>
<%@ <scriptRegister src="httptagprefix="SharePoint" namespace="Microsoft.SharePoint.WebControls" assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<html dir="ltr" xmlns="http://yoursitewww.w3.org/_layouts1999/MicrosoftAjax.js"><xhtml">

<head runat="server">
<meta name="WebPartPageExpansion" content="full" /script>>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<meta http-equiv="X-UA-Compatible" content="IE=10" />
<SharePoint:CssRegistration Name="default" runat="server"/>
</head>

<script src="httpsrc="https://yoursiteajax.googleapis.com/_layoutsajax/splibs/jquery/1.core12.4/jquery.min.js"></script>
    <script type="text/javascript" src="http://yoursiteajax.aspnetcdn.com/_layoutsajax/sp4.runtime0/1/MicrosoftAjax.js"></script>
<script>
    
 <script src="http 
   $(document).ready(function(){
        var scriptbase = "http://yoursiteepm/workflow" + "/_layouts/sp15/";
    //Do not change the order, scripts should load by order.js"><  
     $.getScript(scriptbase + "init.js",
            function () {
                $.getScript(scriptbase + "SP.Runtime.js",
                   function () {
                $.getScript(scriptbase + "SP.js", execOperation);
              });
          });
           });
/script>/ **add your code**


function execOperation() {
    // get context and then username
    context = new SP.ClientContext.get_current();
    web = context.get_web();
 
    getUserName();
}


function getUserName() {
    user = web.get_currentUser();
    context.load(user);
    context.executeQueryAsync(onGetUserNameSuccess, onGetUserNameFail);
}

function onGetUserNameSuccess() {
    alert('Hello ' + user.get_title());
}

function onGetUserNameFail(sender, args) {
    alert('Failed to get user name. Error:' + args.get_message());
}



<body>

<form id="form1" runat="server">
</form>
</body>

</html>

For more details checkNote Client Side Object Model (JavaScript) - using from external site/page: the above code worked for me at ASPX Page . so you should match it with your code and make sure that the scriptbase variable is set to the correct path of your layout folder

So to use CSOM within IFrame, try to reference the following scripts to your page within Iframe.

<script src="http://yoursite/_layouts/1033/init.js"></script>
    <script src="http://yoursite/_layouts/MicrosoftAjax.js"></script>
    <script src="http://yoursite/_layouts/sp.core.js"></script>
    <script src="http://yoursite/_layouts/sp.runtime.js"></script>
    <script src="http://yoursite/_layouts/sp.js"></script>

For more details check Client Side Object Model (JavaScript) - using from external site/page

So to use CSOM within external page , you should do the following :

Via SharePoint Designer , Add new ASPX Page

At Head Section add your code as the following

The final page sould looks like

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@ Page Language="C#" %>
<%@ Register tagprefix="SharePoint" namespace="Microsoft.SharePoint.WebControls" assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<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</title>
<meta http-equiv="X-UA-Compatible" content="IE=10" />
<SharePoint:CssRegistration Name="default" runat="server"/>
</head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/4.0/1/MicrosoftAjax.js"></script>
<script>
    
   
   $(document).ready(function(){
        var scriptbase = "http://epm/workflow" + "/_layouts/15/";
    //Do not change the order, scripts should load by order.  
     $.getScript(scriptbase + "init.js",
            function () {
                $.getScript(scriptbase + "SP.Runtime.js",
                   function () {
                $.getScript(scriptbase + "SP.js", execOperation);
              });
          });
           });
// **add your code**


function execOperation() {
    // get context and then username
    context = new SP.ClientContext.get_current();
    web = context.get_web();
 
    getUserName();
}


function getUserName() {
    user = web.get_currentUser();
    context.load(user);
    context.executeQueryAsync(onGetUserNameSuccess, onGetUserNameFail);
}

function onGetUserNameSuccess() {
    alert('Hello ' + user.get_title());
}

function onGetUserNameFail(sender, args) {
    alert('Failed to get user name. Error:' + args.get_message());
}



<body>

<form id="form1" runat="server">
</form>
</body>

</html>

Note : the above code worked for me at ASPX Page . so you should match it with your code and make sure that the scriptbase variable is set to the correct path of your layout folder

added 14 characters in body

Source Link

edited Sep 30, 2016 at 21:01

Mohamed El-Qassas MVP ♦

45.4k
9
54
96

It's a normal behavior, IFrame is considered as a page outside SharePoint So the page can't find the SP.js to run your code and hit onQuerySucceeded

So to use CSOM within IFrame, try to reference the following scripts to your sitepage within Iframe.

<script src="http://yoursite/_layouts/1033/init.js"></script>
    <script src="http://yoursite/_layouts/MicrosoftAjax.js"></script>
    <script src="http://yoursite/_layouts/sp.core.js"></script>
    <script src="http://yoursite/_layouts/sp.runtime.js"></script>
    <script src="http://yoursite/_layouts/sp.js"></script>

For more details check Client Side Object Model (JavaScript) - using from external site/page

It's a normal behavior, IFrame is considered as a page outside SharePoint So the page can't find the SP.js to run your code and hit onQuerySucceeded

So to use CSOM within IFrame, try to reference the following scripts to your site.

<script src="http://yoursite/_layouts/1033/init.js"></script>
    <script src="http://yoursite/_layouts/MicrosoftAjax.js"></script>
    <script src="http://yoursite/_layouts/sp.core.js"></script>
    <script src="http://yoursite/_layouts/sp.runtime.js"></script>
    <script src="http://yoursite/_layouts/sp.js"></script>

For more details check Client Side Object Model (JavaScript) - using from external site/page

It's a normal behavior, IFrame is considered as a page outside SharePoint So the page can't find the SP.js to run your code and hit onQuerySucceeded

So to use CSOM within IFrame, try to reference the following scripts to your page within Iframe.

<script src="http://yoursite/_layouts/1033/init.js"></script>
    <script src="http://yoursite/_layouts/MicrosoftAjax.js"></script>
    <script src="http://yoursite/_layouts/sp.core.js"></script>
    <script src="http://yoursite/_layouts/sp.runtime.js"></script>
    <script src="http://yoursite/_layouts/sp.js"></script>

For more details check Client Side Object Model (JavaScript) - using from external site/page

Source Link

created Sep 30, 2016 at 20:49

Mohamed El-Qassas MVP ♦

45.4k
9
54
96

Loading

Stack Exchange Network

Return to Answer