Sharepoint 2013 列表使用JS Link
使用JS Link可以向Sharepoint List注册脚本,重写Field模板,使得对于符合条件的字段改变格式和样式。但是有一个问题是,页面postback的话,JS不会被触发,不知道怎么解,有知道的留言下,谢谢。
Update:postback不触发js,需要把JS Link写成这样: xxxxxx.js | ~sitecollection/SiteAssets/js/xxxxxx.js
webpart中或者是列表中添加JS Link
JS Link地址的格式如下,不能写相对路径或者绝对路径,不然Alert不出来的。
~sitecollection/SiteAssets/js/xxxxxx.js

实例代码,功能是,一个Url 类型的字段,如果字段的文本日期是这个月的显示黄色,是下个月的显示粉色,是上个月的显示绿色。
字段类型

var myDate = new Date();
var month=myDate.getMonth()+1;
(function () { // Create object that have the context information about the field that we want to change it's output render
var gateFiledContext = {};
gateFiledContext.Templates = {};
gateFiledContext.Templates.Fields = {
// Apply the new rendering for Priority field on List View
"GATE_x0020_4_x0020_DUE_x0020_DAT": {
"View": gateFiledTemplate
} ,
"GATE_x0020_5_x0020_DUE_x0020_DAT": {
"View": gateFiledTemplate
} ,
"GATE_x0020_6_x0020_DUE_x0020_DAT": {
"View": gateFiledTemplate
},
"GATE_x0020_7_x0020_DUE_x0020_DAT": {
"View": gateFiledTemplate
}
};
SPClientTemplates.TemplateManager.RegisterTemplateOverrides(gateFiledContext); })(); // This function provides the rendering logic for list view
function gateFiledTemplate(ctx) {
var gateOrgin=ctx.CurrentItem[ctx.CurrentFieldSchema.Name];
var gate = ctx.CurrentItem[ctx.CurrentFieldSchema.Name+'.desc'];
if(gate!=""){
var value=parseInt(gate.split('/')[0]);
if(value==month+1){
return "<span style='background-color:pink;'>" + gate+ "</span>";
}
else if(value==month){
return "<span style='background-color:yellow'>" + gate+ "</span>";
}
else if(value==month-1){
return "<span style='background-color:green'>" + gate+ "</span>";
}else{
return "<a href='"+gateOrgin+"'>" + gate+ "</a>"; ;
}
}
}
效果

MSDN上面的Demo
https://code.msdn.microsoft.com/office/Client-side-rendering-JS-2ed3538a
Sharepoint 2013 列表使用JS Link的更多相关文章
- Sharepoint 2013列表视图和字段权限扩展插件(免费下载)!
记得2014年春节期间,有博客园的网友通过QQ向我咨询Sharepoint 2013列表视图和字段权限扩展,因为之前他看到我博客介绍Sharepoint 2010列表视图和字段的权限控制扩展使用,问有 ...
- SharePoint 2013 列表关于大数据的测试<二>
1.给测试列表添加查阅项字段,100个,代码如下: 2.插入测试数据的方法,注意查阅项字段的格式,代码如下: 3.插入10w条数据,时间花费如下(不建议List[LISTNAME].Items.Add ...
- sharepoint 2013 列表和库标签 元数据导航配置(2)
接前面提到的,如何创建一个术语库.sharepoint 2013 列表和库标签 元数据导航配置(1), 现在要做的,就是如何在自定义或者文档库中使用这个术语库,实现标签功能,通过这些标签,找到对应的文 ...
- SharePoint 2013 列表启用搜索
转载自:http://www.cnblogs.com/jianyus/p/3470117.html SharePoint 2013列表搜索的设置,只是进行完全爬网,就可以使用.如果开启爬网不是很熟练可 ...
- VS 2013 Preview 自定义 SharePoint 2013 列表 之 两个Bug
SharePoint 2013 已RTM了,对于程序员来说又要了解新功能了,同时 VS 2013 也将要 RTM了,两者同时应用定会有不新功能,我们先从 自定义 列表开始. SharePoint 20 ...
- SHAREPOINT 2013 列表之间相互关联
修改内容 1.增加列表设置,隐藏Aid字段操作 SharePoint 列表之间相互关联 例如两张列表之间的父子关系. 思路如下: 列表中新增列表项后会有一个唯一的ID,我们获取到该ID赋予子表即可将两 ...
- SharePoint 2013 列表关于大数据的测试
本文主要介绍SharePoint列表库的效率问题,一直以来以为阙值5k,超过会线性下降,需要分文件夹存放:或许这是之前版本的描述,但是2013版本通过测试,真心不是这么一回事儿. 下面,简单介绍下自己 ...
- SharePoint 2013 列表多表联合查询
在SharePoint的企业应用中,遇到复杂的逻辑的时候,我们会需要多表查询:SharePoint和Sql数据表一样,也支持多表联合查询,但是不像Sql语句那样简单,需要使用SPQuery的Joins ...
- 在SharePoint 2013 之中使用JS从Add-in程序中读取用户配置文件的属性
经过无数次的实验,只有这个程序可以运行正常 ,代码贴出来纯的JSOM,在我的实验环境老是返回未知错误,为了这一个简单的任务,我已经搞了2天了,不过终于搞出来了,使用各种方法后,还有使用代码. func ...
随机推荐
- raphael绘制矢量图2
最近重新再次考虑了下raphael,也没办法把公司的项目给换成raphael的渲染了.大体上的效果稍微考了下其实并不难实现,难点大多集中在对路线以及子路线和方案的转换,以及位置的确定,几乎每操作一步都 ...
- 【原】Oracle11gR2图文安装
作者:david_zhang@sh [转载时请以超链接形式标明文章] http://www.cnblogs.com/david-zhang-index/p/4365475.html 本文以看图说话的方 ...
- Could not find acceptable representation
引起的原因: 由于设置了@ResponseBody,要把对象转换成json格式,缺少转换依赖的jar包,故此错. 解决办法: <dependency> <groupId> ...
- Unity 摄像机Clear Flags和Culling Mask属性用途详解
原文地址:http://blog.csdn.net/tanmengwen/article/details/8798231 1.简述两个属性 1.1 Clear Flags 清除标记 每个相机在渲染时会 ...
- windows下远程连接ubantu
要实现windows下连接ubantu需要安装以下软件: 1. windows下安装winSCP 2. Ubantu下安装OpenSSH Server 可以使用命令行安装openSSH Server: ...
- ionic 通过下载apk升级App
上篇通过更新文件升级APP,如果遇到了比如更新插件之类的问题,上篇是无法解决的,所以为了解决这个问题,需要下载apk文件升级APP. 1.配置文件如下:{'appVersion':'1.0.0', ...
- set -x与set +x指令
转载自:http://www.2cto.com/os/201304/205118.html 参考: http://blog.csdn.net/t0nsha/article/details/860688 ...
- debian系统root用户登录
Debian默认不允许root登录,所以修改之. 让Debian以root登录 1).首先修改gdm3的设定文件(/etc/gdm3/deamon.conf),在[security]字段后面追加如下一 ...
- 精品素材:WALK & RIDE 单页网站模板下载
今天,很高兴能向大家分享一个响应式的,简约风格的 HTML5 单页网站模板.Walk & Ride 这款单页网站模板是现代风格的网页模板,简洁干净,像素完美,特别适合用于推广移动 APP 应用 ...
- 20款优秀的国外 Mobile App 界面设计案例
在下面给大家分享的移动应用程序界面设计作品中,你可以看到不同创意类型的视觉效果.如果你想获得灵感,那很有必要看看下面20个优秀用户体验的移动应用 UI 设计.想要获取更多的灵感,可以访问移动开发分类, ...