SharePoint 2013 列表上的简单 jQuery 在筛选后停止工作

Question

我有一些 jQuery 我正在添加到 SharePoint 页面，为列表中的一些 table 单元格着色。当页面加载时它运行完美，但是当列表被过滤时，代码停止。筛选列表后，我需要做什么才能使其正常工作？

$(document).ready(function(){
$('table.red').closest('td').addClass('redBG');
$('.yellow').closest('td').addClass('yellowBG');

});

Answer 1

为此使用 SharePoint 客户端呈现。这里有一些来自 PnP 的教程：https://github.com/SharePoint/PnP/tree/dev/Samples/Branding.ClientSideRendering 但您也可以搜索 google。

代码：

(function () {
    if (typeof SPClientTemplates === 'undefined')
        return;
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
        OnPostRender: [
          function (ctx) { DoStuff(ctx); },
        ]
    });
})();

function DoStuff(ctx) {
    $('table.red').closest('td').addClass('redBG');
    $('.yellow').closest('td').addClass('yellowBG');
}

将其用作外部 js 文件并将 link 添加到显示列表数据的 ListViewWebPart 的 JSLINK 属性上的文件中。

您的 OnPostRender 函数将在过滤和分页时触发。

Answer 2

这适用于数据表视图中的列表，但为了使其在过滤后适用于标准视图和数据表，我必须包括这两个函数。

     (function () {
        if (typeof SPClientTemplates === 'undefined')
        return;
        SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
        OnPostRender: [
          function (ctx) { DoStuff(ctx); },
        ]
      });
      })();

     function DoStuff(ctx) {
       $('table.red').closest('td').addClass('redBG');
       $('.yellow').closest('td').addClass('yellowBG');
     }
  $(document).ready(function(){
   $('table.red').closest('td').addClass('redBG');
   $('.yellow').closest('td').addClass('yellowBG');
 });

SharePoint 2013 列表上的简单 jQuery 在筛选后停止工作

Simple jQuery on SharePoint 2013 list stops working after filtering

sharepoint

jquery

sharepoint-2013