SharePoint 列表视图修改多行文本字段显示长度

SharePoint 2021-09-22 09:44:32

最近有这么个需求，用户希望在所有项目视图显示多行文本字段，然后，又不希望显示的过场，也就是处理一下长度。

　　一开始就想到用js的方式去处理，偶然间发现还可以用jslink，尝试了一下，非常好用，分享给大家。

　　完整代码

// List View - Substring Long String Sample // Muawiyah Shannak , @MuShannak  (function () {      // Create object that have the context information about the field that we want to change it's output render      var bodyFiledContext = {};     bodyFiledContext.Templates = {};     bodyFiledContext.Templates.Fields = {         // Apply the new rendering for Body field on list view         "Body": { "View": bodyFiledTemplate }     };      SPClientTemplates.TemplateManager.RegisterTemplateOverrides(bodyFiledContext);  })();  // This function provides the rendering logic function bodyFiledTemplate(ctx) {      var bodyValue = ctx.CurrentItem[ctx.CurrentFieldSchema.Name];      //This regex expression use to delete html tags from the Body field     var regex = /(<([^>]+)>)/ig;      bodyValue = bodyValue.replace(regex, "");      var newBodyValue = bodyValue;      if (bodyValue && bodyValue.length >= 100)     {         newBodyValue = bodyValue.substring(0, 100) + " ...";     }      return "" + newBodyValue + "";         }

　　后来，用户又希望鼠标点击缩略文档的时候，能显示所有内容，天啊，满足客户需求，毕竟，客户就是上帝！！！

　　简单的改了一下默认脚本的return的值，如下：

return "" + bodyValue + "" + newBodyValue + "";

然后，再加一个切换效果的脚本，如下：

function changeShow(obj){    var spans = $(obj).find("span");    if(spans[0].style.display == "none")    {        spans[0].style.display = "block";        spans[1].style.display = "none";    }    else    {        spans[0].style.display = "none";        spans[1].style.display = "block";    }}

　　这样，就满足用户单击可以切换缩略文本和完整文本的功了。

　　运行效果