1、 流程表单 HTML 扩展开发1/ 31泛微武汉 耕聚，持续向上的力量！版本 v0.2仅限阅读 请勿传播当您阅读本方案时，即表示您同意不传播本方案的所有内容流程表单 HTML 设计器实现自定义控制表单元素的长度及其他常见需求实现案例流程表单 HTML 扩展开发2/ 31泛微武汉 耕聚，持续向上的力量！文档简要信息:文档主题(Title) 【开发技巧】流程表单 HTML 扩展开发（推荐：设计器实现设置表单元素的长度）作者(Author) 胡顺审批者(To Be Approved By)说明(Comments)文件名称(File Name) 【开发技巧】流程表单 HTML 扩展开发（推荐：设计器实
2、现设置表单元素的长度）.doc文档版本历史:序号 日期 版本 变更说明 修改人 注释1. 2017-12-19 0.1 创建目录功能点 刘泰宏2. 2018-2-1 0.2 完善各模块内容 胡顺3.4.流程表单 HTML 扩展开发3/ 31泛微武汉 耕聚，持续向上的力量！目录1. 说明 . 62. 准备工作 .73. 实现自主设置表单元素的长度 .73.1. 支持 PC 端及手机端 HMTL 模式流程表单（单个流程） .73.2. HMTL 模式流程引入样式文件（一劳永逸） .84. 实现隐藏表单元素表单边框的需求 .114.1. 代码块 .114.2. 实现效果 .115. 实现表单未输入内
3、容时悬浮提醒的效果 .125.1. 代码块 .125.2. 实现效果 .136. 实现提交时校验身份证号码的需求 .156.1. 代码块 .156.2. 实现效果 .177. 实现某个 check 框设置为必填的需求 .187.1. 代码块 .188. html 打印时解决签字意见多个空格问题 .198.1. 代码块 .198.2. 实现效果 .20流程表单 HTML 扩展开发4/ 31泛微武汉 耕聚，持续向上的力量！9. html 同一节点多个签字节点排序。 .219.1. 多个签字节点按时间先后正序排序 .219.2. 多个签字节点按时间先后倒序排序 .249.3. 实现效果 .2610.
4、 html 签字节点格式调整 .2710.1. html 签字节点格式调整为“内容居左，署名居右” .2710.2. 实现效果 .2811. html 签字按时间排序并调整格式 .2911.1 按时间先后顺序排序并调整格式 .2911.2. 按时间先后倒序排序并调整格式 .30流程表单 HTML 扩展开发5/ 31泛微武汉 耕聚，持续向上的力量！1.说明难度：预计时间：1 小时涉及代码开发：有目标需求：此案例适用项目人员通过流程表单 HTML 设计器实现自定义控制表单元素的长度。 当不得不这么做的时候，请参考该方案进行适当调整。 可以按照客户要求对时间流程表单进行适当改造。流程表单上面布局、校
5、验、样式等功能可以 jQuery 的方式进行适当改造。知识点：基本信息： 背景知识：1、 在阅读本教程之前,需具备 html 和 JavaScript 基本知识。2、 在阅读本教程之前,需具备 jsp 页面读写的基本能力。最终效果： 通过流程表单 HTML 设计器实现自定义控制表单元素的长度 实现隐藏表单原始边框 实现表单元素未输入内容时悬浮提醒的效果 html 签字节点格式调整（内容在左，署名在右） html 签字节点按时间排序并调整格式流程表单 HTML 扩展开发6/ 31泛微武汉 耕聚，持续向上的力量！2.准备工作1、 准备一台和正式环境一致操作系统的服务器。3.（推荐）实现自主设置表单
6、元素的长度将附件提供的 width.css 上传到服务器的/css/width/目录下面。css文 件 .zip3.1. 支持 PC 端及手机端 HMTL 模式流程表单（单个流程）1. 在代码块中单个流程引入 css 样式文件如（如图 1） 。流程表单 HTML 扩展开发7/ 31泛微武汉 耕聚，持续向上的力量！（图 1）2. 在需要自主设置长度单元格式设置 class 例如图 2 里面 的 class w50 表示设置这个框子里面的 input长度为 50px。如果设置为 w100 则限制长度为 100px，具体效果如图 3流程表单 HTML 扩展开发8/ 31泛微武汉 耕聚，持续向上的力量
7、！（图 2）（图 3）3.2. HMTL 模式流程引入样式文件（一劳永逸）1. 新建流程界面流程引入 css 样式文件 需要修改 ecology/workflow/request/AddRequestIframe.jsp 文件。如（如图 4） 。流程表单 HTML 扩展开发9/ 31泛微武汉 耕聚，持续向上的力量！（图 4）2. 查看及处理流程界面流程引入 css 样式文件需要修改 ecology/workflow/request/ManageRequestNoFormIframe.jsp。如（如图 4） 。流程表单 HTML 扩展开发10/ 31泛微武汉 耕聚，持续向上的力量！（图 5）3. 手机端流程界面流程引入 css 样式文件需要修改 ecology/mobile/plugin/1/client.jsp。如（如图 6） 。（图 6）
