SharePoint - 显示模板 - 访问客户端上下文对象

时间:2016-02-24 19:13:15

标签: javascript sharepoint display-templates

因此,我正在为SharePoint创建显示模板,而我无法获取上下文,因为我需要它来访问不同的列表及其项目等。一种方法,我可以这样做#39;搜索时看到的是:

var context = Srch.ScriptApplicationManager.get_clientRuntimeContext();

问题是我不知道如何从这个对象访问内容。每次我收到上下文未定义或空的错误,或者我打印出它的文字函数。在其他程序(不是显示模板)中,我只会使用:

var context = new ClientContext(); 

var context = new SP.ClientContext();

或某些变体,但在这种情况下,我无法找到使用第一个的任何文档或示例。只是(大多数)博客说你可以使用它来获取上下文。

我现在的代码大部分都被注释掉了。我现在正试图找出这个背景。提前谢谢。

修改

这是整个(项目显示模板)文件:

<html lang="en" xmlns:mso="urn:schemas-microsoft-com:office:office" xmlns:msdt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882">
<head>

    <title>Marketing Page Item Template</title>

    <!--[if gte mso 9]><xml>
    <mso:CustomDocumentProperties>
    <mso:TemplateHidden msdt:dt="string">0</mso:TemplateHidden>
    <mso:MasterPageDescription msdt:dt="string">This is the item display template for the Marketing Page tasks.  This will organize list/items under its practice.</mso:MasterPageDescription>
    <mso:ContentTypeId msdt:dt="string">0x0101002039C03B61C64EC4A04F5361F385106603</mso:ContentTypeId>
    <mso:TargetControlType msdt:dt="string">;#SearchResults;#;#Content Web Parts;#</mso:TargetControlType>
    <mso:HtmlDesignAssociated msdt:dt="string">1</mso:HtmlDesignAssociated>
    <mso:ManagedPropertyMapping msdt:dt="string">'Title'{Title}:'Title','Assigned To'{Assigned To}:'AssignedTo','Due Date'{Due Date}:'DueDateOWSDATE;DueDate','URL'{URL}:'URL'</mso:ManagedPropertyMapping msdt:dt="string">
    </mso:CustomDocumentProperties>
    </xml><![endif]-->

</head>
<body>
    <div>
        <!--#_


        var siteURL = _spPageContextInfo.siteAbsoluteUrl;
        var title = $getItemValue(ctx, "Title");
        var assignedTo = $getItemValue(ctx, "Assigned To");
        var dueDate = $getItemValue(ctx, "Due Date");
        var listUrl = $getItemValue(ctx, "URL");


        SP.SOD.executeFunc('SP.js', 'SP.ClientContext', function() {

            var context = Srch.ScriptApplicationManager.get_clientRuntimeContext();

            var reqCtx = SP.RequestContext.getCurrent(context);
            var web = reqCtx.get_web();

            var pagesListId = SP.PageContextInfo.get_pageListId();
            var list = web.get_lists().getById(pagesListId);
            var items = list.getItems(SP.CamlQuery.createAllItemsQuery());

            context.load(items);

            context.executeQueryAsync(
               function(){
                   items.get_data().forEach(function(item){
                       console.log(item.get_item('FileRef')); 
                   });
               },
            function(sender,args){
              console.log(args.get_message()); 
            });
        });


        _#-->

            <li>

                <div style="background-color: honeydew; margin: 5px; padding: 5px;">

                <!--#_
                    if (!title.isEmpty)
                    {
                _#-->

                    <h3 style="color: coral;">Title: _#= $htmlEncode(title) =#_</h3>
                    <!--<p>_#= $htmlEncode(ctx.CurrentItem.Title) =#_</p>-->

                    <p>URL: _#= $htmlEncode(listUrl) =#_</p>
                    <p>URL: _#= $htmlEncode(typeof reqCtx) =#_</p>


                <!--#_
                    }

                    if (!assignedTo.isEmpty)
                    {
                _#-->

                        <p style="color: goldenrod;">Assigned To: _#= $htmlEncode(assignedTo) =#_</p>
                        <!--<p>_#= $htmlEncode(ctx.CurrentItem.AssignedTo) =#_</p>-->

                <!--#_
                    }

                    else
                    {
                _#-->

                        <p>There is no assigned person!</p>

                <!--#_
                    }

                    if (!dueDate.isEmpty)
                    {
                _#-->

                        <p style="color: rosybrown;">Due Date: _#= $htmlEncode(dueDate) =#_</p>
                        <!--<p>_#= $htmlEncode(ctx.CurrentItem.DueDateOWSDATE) =#_</p>-->

                <!--#_
                    }

                    else
                    {
                _#-->

                            <p>There is no due date!</p>

                <!--#_
                    }
                _#-->

             </div>

            </li>
    </div>
</body>
</html>

1 个答案:

答案 0 :(得分:2)

Srch.ScriptApplicationManager.get_clientRuntimeContext函数返回SP.ClientRuntimeContext object,表示the runtime context for accessing data from and invoking methods on remote objects

以下示例演示了如何在显示模板中检索列表项和打印页面URL:

var context = Srch.ScriptApplicationManager.get_clientRuntimeContext();

var reqCtx = SP.RequestContext.getCurrent(context);
var web = reqCtx.get_web();

var pagesListId = SP.PageContextInfo.get_pageListId(); //Pages List Id
var list = web.get_lists().getById(pagesListId);
var items = list.getItems(SP.CamlQuery.createAllItemsQuery());
context.load(items);
context.executeQueryAsync(
   function(){
       items.get_data().forEach(function(item){
           console.log(item.get_item('FileRef')); 
       });
   },
   function(sender,args){
      console.log(args.get_message()); 
   });

要确保加载SP.ClientRuntimeContext object,您可以使用SP.SOD.executeFunc function,例如:

SP.SOD.executeFunc('SP.js', 'SP.ClientContext', function() {

    var context = Srch.ScriptApplicationManager.get_clientRuntimeContext();

    //the remaining code goes here...


});   

选项2.使用SP.ClientContext

以下示例演示了如何在显示模板中使用SP.ClientContext class

 SP.SOD.executeFunc('SP.js', 'SP.ClientContext', function() {

        var context = SP.ClientContext.get_current();
        var web = context.get_web();

        var pagesListId = SP.PageContextInfo.get_pageListId();
        var list = web.get_lists().getById(pagesListId);
        var items = list.getItems(SP.CamlQuery.createAllItemsQuery());
        context.load(items);

        context.executeQueryAsync(
           function(){
               items.get_data().forEach(function(item){
                   console.log(item.get_item('FileRef')); 
               });
           },
        function(sender,args){
          console.log(args.get_message()); 
        });
 });