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

  在SharePoint的使用中,默认的样式过于单调经常困扰着我们,其实,SharePoint使用Designer工具,可以很轻松解决这一问题,制作出各式各样漂亮的页面。下面,让我们简单介绍下这一过程。

  1、首先创建一个测试列表,里面的字段如下:

  2、看一眼默认的Dispform.aspx页面,对于新闻来说,基本属于不能看;

  3、使用SharePoint Designer 2013打开列表,找到Dispform.aspx页面,右键在高级模式下编辑该文件,如下图:

  4、一般都是隐藏默认的td,然后新加一行tr、td,然后在新加的位置,添加显示项目表单,选择我们的测试列表News,如下图:

  5、点击ribbon上的菜单,添加/删除列,来编辑我们要显示的列和列的顺序,如下图:

  6、将要显示的列添加到右侧,并排序,如下图:

  7、找到如下位置,来修改Html的样式,修改为我们需要的样式,如下图:

  8、修改完的样式展示,是不是更像一篇新闻了呢?如下图:

  9、修改的Dispform.aspx页面,修改了table的结构,并添加样式,如下图:

  10、添加的自定义样式,当然我们也可以使用外部样式表,如下图:

  11、这样就完了么?错,当我们点击第二条测试数据的时候,发现显示的还是第一条数据,我们还需要为表单做筛选;

  12、在ribbon菜单上,点击筛选,如下图:

  13、筛选的域名就是ID,值需要后面新建一个参数,如下图:

  14、新建参数的截图如下,参数源是查询字符串;

  15、做好的筛选条件,如下图所示:

  16、再次点击第二条数据,发现正确进入了测试数据,很好!完工!

总 结

  以上是Dispform.aspx页面定制的简单思路,可以实现我们需要的展示方式;同样,编辑页面和修改页面,也可以进行相应定制,只要选取不同的视图即可。

时间: 2024-08-03 08:54:06

SharePoint 2013 Designer系列之自定义列表表单的相关文章

SharePoint 2013中如何配置InfoPath列表表单

SharePoint列表,都是通过表单展示,有时候不太符合要求,这时候,我们可以通过定制表单,来是展现更加友好. 1.以员工档案为例,新建列表字段,如下: 2.在列表的Ribbon菜单上,选择自定义表单,如下: 3.弹出对话框,点击允许,如下: 4.打开InfoPath表单,如下图:

SharePoint 2013 Designer系列之数据视图

在SharePoint使用中,数据展示是一块很重要的部分,很多时候我们会采用webpart的形式,但是有一些情况,我们不必使用开发,仅需使用Designer即可,下面让我简单介绍下数据视图的使用. 1.创建一个测试列表,以下为测试列表的字段,如下图: 2.插入一些测试数据(纯属捏造,仅供娱乐),如下图: 3.创建一个测试页面,如下图: 4.在PlaceHolderMain节点里,插入webpartzone,然后插入数据视图,选择我们的测试列表News,如下图: 5.切换到设计标签,选择第四个视图

SharePoint 2013 Designer系列之数据视图筛选

在SharePoint中,我们经常需要对列表进行简单的筛选,这时,数据视图就有作用了,我们可以定制对于字段的筛选,来进行展示:特别的,筛选不同于搜索,并没有对于附件或者文档的全文检索,如果需要全文检索,可以使用列表的垂直搜索功能. 1.新建一个测试页面,然后右键在高级模式下编辑,如下图: 2.在PlaceHolderMain节点里,加入webpartzone,用来添加数据视图: 3.数据视图选择News列表,如下图: 4.列表视图就选择第一个就可以了,如下图: 5.查看测试页面,如下图: 6.在

SharePoint 2013 Designer 入门教程

SharePoint的使用中,SharePoint Designer是非常重要的工具,我们可以通过Designer设计页面.母版页,维护.管理站点,也可以定制列表表单.数据视图,设计工作流等等.下面总结一下之前写过的一些关于Designer的博客,给需要的人参考一下. SharePoint 2013 入门教程之创建及修改母版页 SharePoint 2013 入门教程之创建页面布局及页面 SharePoint 2013 Designer 系列之自定义列表表单 SharePoint 2013 De

SharePoint 2013 关于自定义显示列表表单的bug

1.在SharePoint 2013中,我们隐藏列表Dispform页面的ListFormWebPart部件,转而使用自定义显示列表表单进行展示,因为这样更容易定制我们需要的显示: 2.之后发现文件夹下的文档,查看属性会报错,如下图: 3.报错如下图,没有项目: 4.不在文件夹下的项目,就没有这样的问题,怀疑是获取CurrentItem出问题了,但是没想到怎么去改xslt,如下图: 5.百度谷歌查找解决方案,最后找到定义列表模板,参考jianyi的博客,如下图: 6.然后发现处在文件夹下的ID为

SharePoint 2013 配置InfoPath 列表表单

SharePoint列表,都是通过表单展示,有时候不太符合要求,这时候,我们可以通过定制表单,来是展现更加友好. 1.以员工档案为例,新建列表字段,如下: 2.在列表的Ribbon菜单上,选择自定义表单,如下: 3.弹出对话框,点击允许,如下: 4.打开InfoPath表单,如下图: 5.做表格以后,发现没有相片,添加一个栏,刷新infopath 6.删除默认的表单,添加表格,并填写表格内容,如下: 7.将域添加到表格,拖进来就可以,删除不需要的部分: 8.发布表单,如下: 9.在员工档案列表,

ajax提交表单:用Ajax查询结果初始化记录列表表单

使用List<Map>数组初始化记录列表表单也很方便,这里结合Ajax查询.分页再举一例.分页控件pageObj初始化参数{uid:"",list:""}是必须的,其余可使用默认值.一.效果图二.客户端网页文件newsListForm.html<!--用Ajax查询结果初始化记录列表表单客户端代码胡开明2011-11-21--><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Trans

SharePoint 2013 Designer 自定义操作菜单

众所周知,我们在SharePoint的二次开发中,经常会添加ECB菜单或者Ribbon菜单,通常我们会采取Feature的方式去添加一个Xml,或者采取JavaScript的方式,当然,除此之外,还可以利用Designer添加这些自定义操作,而且更加方便:但是,这种操作还是有缺点的,就是只能添加链接(目前我只发现能添加链接). 内容很简单,截图加描述的方式分享给大家,希望对有需要的人有个参考,呵呵. 1.打开列表,切换选项卡到列表设置,如下图: 2.创建一个ListItem Menu,填写Nam

SharePoint 2013中如何使用自定义的List Template

Overview 对于企业员工来说,"扁平结构"的LIST是日常操作中经常使用到的,LIST的好处是方便数据的录入以及数据的整理分析,尤其是Quick Edit功能,可以实现快速编辑.对于SharePoint 2013而言,默认在Site Contents中提供了自定义的List 模版,可以方便的对其进行增加Columns,从而实现功能上的拓展. 随着业务复杂度的提高,往往会在List中添加多个Columns.比如现在公司里的CRC们会创建30~40个Columns在一个List中.并