SharePoint 2016自定义JavaScript未触发OnPostRender

时间:2018-06-05 13:50:40

标签: javascript sharepoint sharepoint-2016

我在已上传到SharePoint 2016实例的JavaScript文件中有自定义标注过程。几乎完全相同的代码与SharePoint Online实例一起使用没有任何问题。

代码中唯一的区别是包含SP.SOD.executeFunc以确保加载来自SharePoint的callout.js。

当我点击文档库中的相关元素时,似乎正在发生的是代码被拾取但未加载。如果我然后单击列表上的省略号,触发SharePoint提供的标准标注,然后单击我的元素 - 代码运行。但是当我第一次加载页面时,我可以在可用资源列表中看到callout.js。

如何在首次加载页面时让我的代码可用,并使用自定义标注单击我的元素,而不必先单击默认的SharePoint标注对象?

SP.SOD.executeFunc("callout.js", "Callout", loadPreview);

function loadPreview()
{
    var itemCtx = {};
    itemCtx.Templates = {};
    // Define the list template type
    itemCtx.ListTemplateType = 101;
    itemCtx.OnPostRender = function(ctx) {
        var rows = ctx.ListData.Row;
        for (var i = 0; i < rows.length; i++) {
            if (rows[i].File_x0020_Type.toLowerCase() === 'eml') {
                var rowElementId = GenerateIIDForListItem(ctx, rows[i]);
                CustomRenderEMailSection(ctx, rows[i], rowElementId);
            }
        }
    };

    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(itemCtx);
};

function buildCallout(renderCtx, data)
{
  jQuery(document).ready(function ()
  {
        var placeHolder = jQuery(jQuery(jQuery(renderCtx.getContentElement()).children(".js-callout-body")[0]).children(".emailPlaceHolder")[0])
        var url = placeHolder.attr("data-url")
        placeHolder.html("<p>Hello!</p>");
  });
}

function CustomRenderEMailSection(ctx, row, rowid)
{
  if (row.File_x0020_Type.toLowerCase() !== 'eml') return;
  var td = document.getElementById(rowid).cells[0].querySelector("div");
  var url = converationDomain + "/sharepoint/previewemail?url=" + sharePointDomain + encodeURIComponent(row.FileRef);
  EnsureScriptFunc("callout.js", "Callout", function ()
  {
        var calloutPopUpOptions = {}
        calloutPopUpOptions.ID = 'EmailPreviewCallout_' + rowid; //Set the id  
        calloutPopUpOptions.launchPoint = td; //Set the destination element  
        calloutPopUpOptions.beakOrientation = 'topBottom';
        calloutPopUpOptions.onOpeningCallback = function (calloutPopUpOptions) { return buildCallout(calloutPopUpOptions, null); }
        calloutPopUpOptions.content = "<div class='emailPlaceHolder' data-url='" + url + "'></div>";
        calloutPopUpOptions.openOptions = { event: 'click', showCloseButton: true };
        calloutPopUpOptions.contentWidth = 600;
        CalloutManager.createNewIfNecessary(calloutPopUpOptions);
  });
}

更新

我设法证明问题是由脚本上传的方式引起的。由于需要在整个站点中使用,我使用PowerShell命令Add-PnPJavaScriptLink使其可用于所有页面(我可以看到它为所有页面加载)。

但是,如果我将JavaScript发布到网站资源中并直接在网页上的资产网页部分上引用它,它就会按预期工作。

specify js to be used on a web part

0 个答案:

没有答案