SharePoint 2013 通过JavaScript实现列表标题列宽度可拖动

前言

  最近有个新需求,用户希望标题栏可以拖动宽度,其实觉得没什么用,既然用户要了又推不掉,就勉为其难实现一下吧。

  其实原理比较简单,就是利用JavaScript对标题栏进行宽度控制,然后从网上搜了一下,碰巧看到有人写好的方法,秉承拿来主义的精神,就借用了一下,详细脚本参考附录。

  1、默认的SharePoint列表是下面的样子,每一列的内容都是自适应的,很紧凑,其实也还好;

  2、拖动以后的样子是下面的,其实感觉也没什么用,很鸡肋,想想用户后续肯定会提,把当前状态保存下来的需求;

  虽然自己这次没有把这个需求做好,但是心里有底了,依旧利用JavaScript把各个列的宽度,保存到cookie里就行了;当然有人说禁用了cookie的问题,那就想办法存到url或者服务器端控件吧;还好我们统一的IE策略,不会禁用cookie的。

  3、其实具体步骤非常简单,就是把附录的脚本文件传到文档库,引用一下,然后在这个视图中初始化一下这个表格就可以了;

  4、然后在页面上的引用,也非常简单,如下图:

  5、其实,SharePoint和JavaScript的结合可以做很多事儿,最近也用EasyUI在SharePoint做一些尝试,结合SharePoint本身的特性,感觉还是不错的。

EasyUI在SharePoint的简单示例

  就像之前做的一个例子,感觉虽然不是特别完美,但是也间接实现了用户的需求。用户希望这个Filter可以进行搜索,因为可能会有太多选项。

  所以把这个功能拿出来,专门做成一个搜索框了,利用EasyUI自带的功能,把控件初始化以后,可以有搜索功能;

  效果如下图:

总结

  当然,可能做得功能比较简单,想表达的意思是JavaScript本身在SharePoint中应用越来越广泛,希望大家可以多多使用,多多实践,多多分享。遇到一些比较奇葩的需求,想起我们还有JavaScript这一前端武器。

  特别要说的,这些东西不仅仅适用于本地的SharePoint开发和实施,同样适用于世纪互联和国际版的SharePoint Online。

附录

  http://www.cnblogs.com/mlcactus/p/4118714.html

时间: 2024-10-17 23:00:24

SharePoint 2013 通过JavaScript实现列表标题列宽度可拖动的相关文章

SharePoint 2013 中文站点更新列表字段的标题(Title)不能work

本文讲述SharePoint 2013 中文站点更新列表字段的标题(Title)不能work的解决方案. 笔者的项目环境是个Varation的站点集,有中文和英文两个子站点. 但是下面创建不修改字段标题的代码,修改标题部分在英文站点里面可以工作,但中文站点里面没有效果: string dateField = myList.Fields.Add("DateFiled", SPFieldType.DateTime, false, false, null); SPFieldDateTime

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

本文介绍两种为列表视图设置时间段筛选器的方法.其中,第一个方法用于SharePoint Server,第二个方法同时还能用于SharePoint Foundation. 方法一:日期筛选器Web部件 先看一下接下来要用的列表,是一个任务列表: 为了实验方便,我们先建个页面,用来放置目标列表视图和筛选器. 1.打开SPD,选择左侧的“网站页面”,点击功能区里的“新建”->"Web部件页". 如果是已有页面,则右键高级模式编辑. 2.找到页面主要区域的WebPart Zone,在其中

SharePoint 2013 中代码创建列表查阅项字段

1.首先,打开VS创建两个List Definition,分别是Address和City,如下图: 2.City列表里修改Title为City Name,其实内部名称还是Title,注意一下: 3.给City的列表实例,添加几个值,用来测试使用,如下: 4.在Address列表里添加几个字段,分别是CityName(LookUp类型)和HomeAddress(Single Line of Text),如下: 5.查看Address列表的Schema.Xml,尤其是Fields节点,也就是字段,如

Office 365 plans, SharePoint Online, and SharePoint 2013 on-premises 功能对比列表

Andrew ConnellSharePoint大牛整理了一个各个版本SharePoint功能对比列表,是SharePoint相关人员必备资料.赶紧收藏起来. SharePoint 2013 Feature Matrix Office 365 plans, SharePoint Online, and SharePoint 2013 on-premises 功能对比列表,布布扣,bubuko.com Office 365 plans, SharePoint Online, and SharePo

SharePoint 2013 使用JavaScript对象模型配置智能提示

前言 默认在VS2012/2013中编写SharePoint JavaScript 客户端对象模型,都没有智能感知的功能,用起来非常麻烦:其实,我们可以手动配置一下,让JavaScript可以进行智能感知,下面,让我们简单看一下整个过程. 1.在VS的Tools下面,找到Options选项,找到Text Editor下面的JavaScript,选中IntelliSense下面的References,看一下里面有没有~/Scripts/_references.js这一条,如果没有添加上(添加很简单

关于在SharePoint 2013(2010)中Javascript如何实现批量批准的自定义操作功能?

1.概述: SharePoint 2013(包括SharePoint 2010)提供了很方便的,多选的界面,但是很多操作还是不能批量进行,比如:批准的功能.如果您要解决方案不关心代码,那么请直接联系作者.如果您对技术感兴趣,那么下面的组合拳就是告诉你如何在2013的Ribbon的工具栏上实现这个小功能,整个实验必须要有SPD(SharePoint Designer 2013),要使用到Javascript的很多知识.作者完全从实际出发,应对了在这个过程中可能出现的各种各样的"状况",比

在 SharePoint 2013中使用 RelatedItems 列(Site column)

本文讲述 在 SharePoint 2013中使用 RelatedItems 列(Site column). RelatedItems 一个隐藏的 Site column,用于存储与当前列表项(List Item) 有关的其他文档或列表项. 比较有意思的是,添加和删除RelatedItem都是在 View Form,而不失Edit Form: 那么这个列既然是隐藏字段,怎么把它修改成可以加入到其他列表和文档库的公共字段(Site column)呢? a.打开站点设置(Site settings)

SharePoint 2013 Designer系列之自定义列表表单

在SharePoint的使用中,默认的样式过于单调经常困扰着我们,其实,SharePoint使用Designer工具,可以很轻松解决这一问题,制作出各式各样漂亮的页面.下面,让我们简单介绍下这一过程. 1.首先创建一个测试列表,里面的字段如下: 2.看一眼默认的Dispform.aspx页面,对于新闻来说,基本属于不能看: 3.使用SharePoint Designer 2013打开列表,找到Dispform.aspx页面,右键在高级模式下编辑该文件,如下图: 4.一般都是隐藏默认的td,然后新

每日学习心得:SharePoint 2013 自定义列表项添加Callout菜单项、文档关注、SharePoint服务端对象模型查询

前言: 前一段时间一直都比较忙,没有什么时间进行总结,刚好节前项目上线,同时趁着放假可以好好的对之前遇到的一些问题进行总结.主要内容有使用SharePoint服务端对象模型进行查询.为SharePoint 自定义列表项添加callout菜单.希望能够给大家带来一些帮助. 1.  在aspx页引用可视化Web部件 有时候会需要在页面中引用项目中创建的可视化Web部件,具体步骤有以下这几步: 1) 在aspx页面顶部注册该可视化Web部件 示例如下: <%@ Register Tagprefix=&qu