前言

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

  一开始就想到用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 "<span title='" + bodyValue + "'>" + newBodyValue + "</span>"; }

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

  简单的改了一下默认脚本的return的值,如下:

return "<div onclick='changeShow(this)'><span style='display:none;'>" + bodyValue + "</span><span style='display:block;'>" + newBodyValue + "</span></div>";

然后,再加一个切换效果的脚本,如下:

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";
}
}

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

  运行效果

附参考链接 https://code.msdn.microsoft.com/office/Client-side-rendering-code-93e7077d

SharePoint 列表视图修改多行文本字段显示长度的更多相关文章

  1. Dynamic 中修改实体中主字段的长度

    select EntityId,* from MetadataSchema.Entity where Name='dji_incidentaddress' SELECT TOP 100 [Attrib ...

  2. EF中限制字段显示长度

    在EF中有些添加的字段 文本显示超多文字,想截取显示又没有截取功能. 怎么办? 我们可以在EF中类的属性中设置 你想限制这个用户名只能有10个字符长度 public String UserName { ...

  3. GridView1_RowDataBound解决限制字段显示长度用"..."显示ToolTip

    ToolTip: // // 摘要: // 获取或设置当鼠标指针悬停在 Web 服务器控件上时显示的文本. // // 返回结果: // 当鼠标指针悬停在 Web 服务器控件上时显示的文本.默认值为 ...

  4. SharePoint 列表权限控制

    一提到sharepoint 我相信权限控制一定会是一个很重要的话题,尤其是对列表的权限控制,创建.修改.查看权限.其实网上这方面的资料已经很多了,尤其是以下2篇文章,后来索性把CodeArt_Perm ...

  5. Display a Detail View with a List View 主子视图-列表视图与详细信息视图同时显示

    In this lesson, you will learn how to display a Detail View together with a List View. For this purp ...

  6. Sharepoint 2013列表视图和字段权限扩展插件(免费下载)!

    记得2014年春节期间,有博客园的网友通过QQ向我咨询Sharepoint 2013列表视图和字段权限扩展,因为之前他看到我博客介绍Sharepoint 2010列表视图和字段的权限控制扩展使用,问有 ...

  7. SharePoint 2013无代码实现列表视图的时间段动态筛选

    本文介绍两种为列表视图设置时间段筛选器的方法.其中,第一个方法用于SharePoint Server,第二个方法同时还能用于SharePoint Foundation. 方法一:日期筛选器Web部件 ...

  8. SharePoint 多行文本字段设置默认值

    前言 最近有这样一个需求,创建一个表单,里面有多行文本字段,但是要求内容默认带一个表格,这样用户新建项目的时候,就可以直接填表格了. 好吧,这样的需求我们可以通过JavaScript实现. 1.默认的 ...

  9. 修改sharepoint列表样式

    1.将sharepoint 的样式修改为阴影 2.用designer打开列表的AllItems.aspx文件,将下面的样式拷贝到里面     <style type="text/css ...

随机推荐

  1. 使用react中遇到的问题

    引入antdesign中Carousel走马灯时遇到问题? Uncaught Error: Element ref was specified as a string (slick) but no o ...

  2. Java编程的逻辑 (57) - 二进制文件和字节流

    本系列文章经补充和完善,已修订整理成书<Java编程的逻辑>,由机械工业出版社华章分社出版,于2018年1月上市热销,读者好评如潮!各大网店和书店有售,欢迎购买,京东自营链接:http:/ ...

  3. 【LOJ】#2071. 「JSOI2016」最佳团体

    题解 01分数规划,二分加树背包-- 代码 #include <bits/stdc++.h> #define enter putchar('\n') #define space putch ...

  4. Ubuntu系统无法获得锁/var/lib/dpkg/lock - open (11: 资源暂时不可用)的解决方案

    Ubuntu系统无法获得锁/var/lib/dpkg/lock - open (11: 资源暂时不可用)的解决方案     问题 使用Ubuntu打开终端时,输入带有sudo apt-get 命令行是 ...

  5. Win10解决无法访问其他机器共享的问题

    Win10解决无法访问其他机器共享的问题     你不能访问此共享文件夹,因为你组织的安全策略阻止未经身份验证的来宾访问.这些策略可帮助保护你的电脑免受网络上不安全设备或恶意设备的威胁. 管理员身份执 ...

  6. java 注解 总结

    http://www.importnew.com/23564.html 注解的好处: 1.能够读懂别人写的代码,特别是框架相关的代码. 2.本来可能需要很多配置文件,需要很多逻辑才能实现的内容,就可以 ...

  7. 【WIN10】WIN2D——圖像處理

    源碼下載:http://yunpan.cn/c3iNuHFFAcr8h  访问密码 8e48 還是先來看下截圖: 實現了幾個效果:放大.縮小.旋轉.左右翻轉.上下翻轉,亮度變化.灰度圖.對比度.高斯模 ...

  8. Java 操纵XML之读取XML文件

    Java 操纵XML之读取XML文件 一.JAVA DOM PARSER DOM interfaces The DOM defines several Java interfaces. Here ar ...

  9. 3143 二叉树的序遍历codevs

    题目描述 Description 求一棵二叉树的前序遍历,中序遍历和后序遍历 输入描述 Input Description 第一行一个整数n,表示这棵树的节点个数. 接下来n行每行2个整数L和R.第i ...

  10. BZOJ.4032.[HEOI2015]最短不公共子串(DP 后缀自动机)

    题目链接 1.求A的最短子串,它不是B的子串. 子串是连续的,对B建SAM,枚举起点,在SAM上找到第一个无法匹配点即可.O(n)用SAM能做吗..开始想错了. 2.求A的最短子串,它不是B的子序列. ...