Sharepoint 2013 列表 - 如何有条件地为 sharepoint 列表中的 java 脚本计算字段着色？答案

【问题标题】：Sharepoint 2013 list - how to conditionally colour java script calculated fields in sharepoint list?Sharepoint 2013 列表 - 如何有条件地为 sharepoint 列表中的 java 脚本计算字段着色？
【发布时间】：2020-08-19 01:00:42
【问题描述】：

我在Sharepoint 2013 列表中处理了一些脚本，它从根本上根据列表检查某些条件并返回“待处理”、“完成”、“过期”或“缺少到期日期”。

为了检查当前日期，我使用了一些在网上找到的 Java 脚本并对其进行了修改以适用于我的列表。唯一的问题是，我也在尝试为文本着色：

如果值为“过期”则为红色

如果值为“完成”则为绿色

所有其他情况为黑色。

代码正确返回值并将“完成”值设置为绿色，但我无法将“过期”值设置为红色。

这是我的代码：

="<div style='text-align:left; color:"

&IF([Completed Date]="",""

&"<img src='/_layouts/images/blank.gif' onload=""{"

&"var SPday=new Date();"

&"SPday.setFullYear("&YEAR(DueDate)&","&MONTH(DueDate)-1&","&DAY(DueDate)&");"

&"var Days=Math.round((SPday.getTime()-new Date().getTime())/86400000);"

&"this.parentNode.innerHTML=((Days<0)?'red':'black');"

&"}"""

&"","green")

&"'>"

 

&IF([Completed Date]="",IF(ISBLANK(DueDate),"Missing Due date","<img src='/_layouts/images/blank.gif' onload=""{"

&"var SPday=new Date();"&"SPday.setFullYear("&YEAR(DueDate)&","&MONTH(DueDate)-1&","&DAY(DueDate)&");"

&"var Days=Math.round((SPday.getTime()-new Date().getTime())/86400000);"

&"this.parentNode.innerHTML=((Days<0)?'Overdue':'Pending');"

&"}"">"),"Complete")

&"</div>"

可以通过这种方式完成还是我应该尝试另一种方式？

【问题讨论】：

标签： javascript html sharepoint-2013 sharepoint-list

【解决方案1】：

对于这种复杂的逻辑，你最好使用CSR。

(function () {
    'use strict';

    var CustomCtx = {};

    /**
     * Initialization
     */
    function init() {

        CustomCtx.Templates = {};

        CustomCtx.Templates.Fields = {
            // update ChangeCompleted as your filed static name
            'ChangeCompleted': {
                'View': customDisplay
            }
        };

        // Register the custom template
        SPClientTemplates.TemplateManager.RegisterTemplateOverrides(CustomCtx);
    }

    /**
     * Rendering template
     */
    function customDisplay(ctx) {
        //your logic here
    }   

    // Run our intiialization
    init();

})();

供您参考的链接。

https://social.msdn.microsoft.com/Forums/office/en-US/154c3ed9-9e22-4fda-aba2-b7b12cc4a509/changing-text-color-in-sharepoint-based-on-column-value?forum=sharepointdevelopment

https://www.codeproject.com/Articles/620110/SharePoint-Client-Side-Rendering-List-Views

【讨论】：