前言

  我们在使用SharePoint 工作流的时候,有一点很不友好,那就是表单的UI,真的是太简(nan)单(kan)了,所以,定制表单几乎成了国内工作流开发的重中之重,几乎没有任何项目使用默认的表单功能。

  下图就是默认的表单截图,我们看到样子真的是。。。

  不说了,下一个步骤!

  引入表单组件

  我们这里用的是LayUI(https://www.layui.com/),也就是一个开源的表单组件库,至于为什么选择这个库?我喜欢呗,够直接不?

  1.在官网下载最新版本的开源代码,如下图:

  2.打开SharePoint Online站点,进入Site Contents,如下图:

  为了在网站内容里,添加一个库,存我们下载的前段代码

  3.点击add an app按钮,来为网站添加一个应用,如下图:

  4.选择Document Library,也就是文档库类型,如下图:

  专门用来保存文档类型的文件

  5.输入要添加的文档库的名称,如下图:

  选择一个我们喜欢的名字,会影响接下来开发的心情,建议用英文命名,不要添加任何的表单符号、特殊字符和数字等

  6.选择Open with Explorer按钮,以Windows资源管理器方式打开文件夹,如下图:

  这个请用IE浏览器,为什么?因为同是微软的产品,兼容性好呗

  7.复制前面下载的表单插件源代码文件夹,到这个打开的视图下粘贴,如下图:

  可能会很长时间,也可能会很短,取决于文件大小和网速

  创建工作流提交表单

  8.用SharePoint Designer打开网站,左侧导航进入Site Pages库,点击菜单上的新建Web 部件页添加一个页面,如下图:

  9.这里随便选择一个布局,看你心情就好,如下图:

  为什么这么随便呢?因为布局不重要,最后都是要被我们删掉的,我们要重写我们的布局

  10.先在菜单上签出文件(有可能没开启版本控制,就不需要签出),然后在文件上点击右键,选择在高级模式下编辑文件,如下图:

  11.在打开页面的头部添加JavaScript脚本和CSS样式表的引用,同是添加我们需要用的内部样式,如下图:

  内部样式不是一开始就有的,是我们添加完布局,但是不够完美需要简单调整一下才有的

  12.在内容节点里删除原来的代码,如下图:

  这就是为什么之前说布局没有用了,当然,你也可以用,只要开心就好

  13.添加我们需要的HTML代码,我这里都是调整以后的,如下图:

  大家如果用layui,可以看看官方sdk,当然,你也可以选择其他表单控件,还是那句话,你开心就好,这个不重要,原理都是一样的

  14.添加我们表单提交和保存的脚本声明,如下图:

  15.所有工作完毕以后,来看看我们定制的创建流程审批申请的表单吧!是不是比之前默认的,好看太多了?

  这就是化妆的结果,不化好妆,怎么好意思见客户呢?

  结束语

  这篇文章主要介绍如何定制表单,整个逻辑还是很简单的,当然你不必要跟我选择一样的表单控件,你开心就好。

  下一篇文章,会为大家介绍如何绑定审批人到控件上,以及如何保存或者提交这个申请。

SharePoint Online 定制工作流表单相关推荐

  1. 不得不说,还是这款开源工作流表单设计器较合心意!

    近几年,低代码的热潮持续不断.且不说之前的阿里钉钉跨平台写作方式.飞书上的审批流程,就说现在我们大部分人接触到的表单审批.投票的模板等,几乎都是以低代码的方式来呈现在大家面前的.在数字化转型的浪潮下, ...

  2. 驰骋工作流-表单引擎- ccform

    2.2:    驰骋工作流表单引擎 ccform Ccform与ccflow珠联璧合,ccflow是解决流程运转问题,ccform是解决了组装货物的问题.Ccflow是汽车的控制系统,ccform就是 ...

  3. 定义html表格的大小和位置,点晴OA工作流表单设计:表格table及宏控件的HTML、CSS、字体参数教程详解...

     点晴OA工作流表单设计:表格table及宏控件的HTML.CSS.字体参数教程详解 说明:虽然点晴OA内置了强大的富文本编辑器,但是很多时候还是难以实现理想的精确显示效果,为了实现满意的显示效果,网 ...

  4. 怎么选工作流表单设计器?

    随着业务量的扩大,很多企业都想选择一款优良的工作流表单设计器来提升工作效率和质量.在大数据时代,操作简单.维护便利的工作流表单设计器确实能为企业的发展带来更大的帮助,也是企业实现数字化转型的得力帮手. ...

  5. oa导入表格html,点晴OA工作流表单模板创建注意事项(Word、Excel复制粘贴变形如何解决)...

     点晴OA工作流表单模板创建注意事项(Word.Excel复制粘贴变形如何解决) 很多用户反映点晴OA系统中工作流表单创建时对于表格的控制十分的麻烦,希望能够做出漂亮的效果,但往往事违人愿.下面将工作 ...

  6. 工作流表单自定义功能的误区

    表单自定义功能看似非常方便,可以不用写代码即可完成表单的开发设计,表面上看的确是减少不少开发成本,但深入研究,发现是有不少误区的. 1.              对于整体成本来讲,当表单自定义功能能 ...

  7. SharePoint 使用脚本为表单绑定事件

    在SharePoint的使用过程中,我们经常需要为表单页面做一些特殊处理,比如说新建页面的时候有多选项的字段,但是只能选择指定数量的选项,尤其在新闻列表或者调查列表等特殊场景中,广泛使用. 下面,我们 ...

  8. 一步步学习SPD2010--第九章节--使用可重用工作流和工作流表单

    本章内容: 1.      创建和使用可重用工作流 2.      创建关联栏目 3.      使用工作流模板 4.      重用和创建全局可重用工作流 5.      创建初始和关联表单 6.  ...

  9. java 工作流表单设计器 设计方案

    工作流模块------------------------------- 1.模型管理 :web在线流程设计器.导入导出xml.复制流程.部署流程 2.流程管理 :导入导出流程资源文件.查看流程图.根 ...

最新文章

  1. 某程序员求助:隔壁组组长常常微信骚扰自己怎么办?组长和自己都是男生,自己是双性恋,但想找个年轻的!网友:信息量太大!...
  2. 社交网络图挖掘2--社区的直接发现和图划分
  3. Angularjs相关文章地址
  4. 9、ctemplate文档,简记(2)
  5. 设计模式:模板方法(Template Method Pattern)
  6. matlab-画个拱桥和倒影?
  7. 数据港:攻破OPEX+SLA难题,实现全生命周期效能管理
  8. CserialPort类的简单用法
  9. 在Nginx上配置ThinkPHP项目
  10. word双引号间距大_微软判定:Word 编辑英文句号后“两个空格”为拼写异常
  11. Android实现浮层的上下滑动(支持内部加入View)
  12. 《Linux命令行与shell脚本编程大全 第3版》Linux命令行---11
  13. 弹窗编辑jsp报表内数据
  14. python中out函数_cython函数输出与python函数outpu略有不同
  15. 微信小程序云开发教程-JavaScript入门(5)-函数异步同步
  16. 课时1 Excel简介与基本操作
  17. 从零开始用 Windows C++ 桌面程序制作方舟同人游戏(五)
  18. 《实时控制软件设计》团队项目分组
  19. node 爬虫 实战 - 爬取拉勾网职位数据
  20. mysql的连接配置时区语句

热门文章

  1. java程序员电脑重置及配置全过程,注意事项
  2. msmtp详细安装及使用
  3. Jenkins:参数化构建:多分支|多模块|回滚|打印日志
  4. 百家号情感领域和历史领域写什么
  5. 蚊帐上有两个破洞的补充办法
  6. 沟通不畅、管理不便、效率低下......君子签电子签约助力企业高效办公、业务不停
  7. git常见命令和更新、发布
  8. Python数据清洗小技巧——分组聚合
  9. ax = fig.gca(projection=‘3d‘)报错的解决方法
  10. python连接sql server数据库并模糊查询