Question

我不知道Sharepoint脚本和我的同事不懂JavaScript。他使用他在http://www.wonderlaura.com/Lists/Posts/Post.aspx?ID=228上找到的脚本来设置名为Progress1的列的行，以显示红色或绿色图像;

// JS Link script to show good and bad in colors 
// Upload this file in _catalogs/masterpages as a JavaScript Display Template
(function () {
    var patientFieldCtx = {};

    // Define template variable
    patientFieldCtx.Templates = {};

    // Define your required fields and functions to call in each case.
    // In our case the field is Progress
    // Override Function is PatientProgressViewTemplate

    patientFieldCtx.Templates.Fields = {
        "Progress1": {
            "View": PatientProgressViewTemplate
        },

    };

    // Register the template override with SP2013
        SPClientTemplates.TemplateManager.RegisterTemplateOverrides(
    patientFieldCtx
    );

})();

// Override Progress Level field with color based on conditional value 
function PatientProgressViewTemplate(ctx) {
    var _progressValue = ctx.CurrentItem.Progress1;

     if (_progressValue == 'Good') //field value
     {
         //return "<font style='color:green'>" + _progressValue + "</font>";
         return "<div style='text-align: center;' ><img src='../../SiteAssets/Green_Light_Icon.png' height='16' width='16'/>";

     }

     if (_progressValue == 'Bad')
     {
         return "<div style='text-align: center;' ><img src='../../SiteAssets/Red_Light_Icon.png' height='16' width='16'/>";
     }
}

在同一视图中，还有另一个名为Progress2的列，其中需要应用相同的脚本。所以我建议;

// JS Link script to show good and bad in colors 
// Upload this file in _catalogs/masterpages as a JavaScript Display Template
(function () {
    var patientFieldCtx = {};
    var columns = ["Progress1", "Progress2"];

    for (var index = 0; index < columns.length; index++) { 
        // Define template variable
        patientFieldCtx.Templates = {};

        // Define your required fields and functions to call in each case.
        // In our case the field is Progress
        // Override Function is PatientProgressViewTemplate

        patientFieldCtx.Templates.Fields = {
            columns[index]: {
                "View": PatientProgressViewTemplate
            },

        };

        // Register the template override with SP2013
        SPClientTemplates.TemplateManager.RegisterTemplateOverrides(patientFieldCtx);
    }

})();

// Override Progress Level field with color based on conditional value 
function PatientProgressViewTemplate(ctx) {

    var _progressValue = ctx.CurrentItem[ctx.CurrentFieldSchema.Name];


     if (_progressValue == 'Good') //field value
     {
         //return "<font style='color:green'>" + _progressValue + "</font>";
         return "<div style='text-align: center;' ><img src='../../SiteAssets/Green_Light_Icon.png' height='16' width='16'/>";

     }

     if (_progressValue == 'Bad')
     {
         return "<div style='text-align: center;' ><img src='../../SiteAssets/Red_Light_Icon.png' height='16' width='16'/>";
     }
}

然而，这不起作用。关于为什么没有线索。我不得不承认，虽然我有VS我不是用VS来测试它。我怀疑我必须这样做。

Answer 1

您应该在代码的一部分中设置字段，如下所示：

patientFieldCtx.Templates.Fields = {
        "Progress1" : {
            "View": PatientProgressViewTemplate
        },
        "Progress2" : {
            "View": PatientProgressViewTemplate
        }
    };

对于数组尝试此解决方案：

    var patientFieldCtx = {};
    var columns = ["Progress1", "Progress2"];
    patientFieldCtx.Templates = {};
    patientFieldCtx.Templates.Fields = {};
    for (var index = 0; index < columns.length; index++) { 
            patientFieldCtx.Templates.Fields[columns[index]]= {"View": PatientProgressViewTemplate};
    }
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(patientFieldCtx);

Webpart javascript不适用于数组

1 个答案: