按照前一篇(

SharePoint JS Link 之（一） 改变column的颜色

)修改之后，查看文档属性，发现Language列颜色并没有变：

要想让这个颜色变，需要做一些修改。为displayForm注册一个事件：

(function () {

   var FieldContext = {};
   FieldContext.Templates = {};
   FieldContext.Templates.Fields = {
       //为我们要修改颜色的列，定义一个重写样式的方法
       "Language": { "View": FieldTemplate,"DisplayForm": DisplayTemplate}
   };

   //注册Context给SharePoint
   SPClientTemplates.TemplateManager.RegisterTemplateOverrides(FieldContext);
})();

然后再添加一个实现函数。这里我们为Language列设置背景色。

function DisplayForm(ctx) {

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

   switch (Language) {
       case "English":
           return "<span style='background-color :#D9D919'>" +Language + "</span>";
           break;
       case "Korean (Korea)":
           return "<span style='background-color :#2D882D'>" +Language + "</span>";
           break;
    }
}

最终的代码是：

function DisplayForm(ctx) {

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

   switch (Language) {
       case "English":
           return "<spanstyle='background-color :#D9D919'>" + Language +"</span>";
           break;
       case "Korean (Korea)":
           return "<span style='background-color :#2D882D'>" +Language + "</span>";
           break;
    }
}

保存文件，上传到Style Library里(原来的地方)。

找到任何一个列表项，进去到view properties页面，然后edit page，给display form的webpart属性里，加JSLink。

就会看到下面的效果：