Online表单高级应用 === **目录索引:** - Online表单模板设计 1. Word表单模板设计 2. 上传Word表单模板/复制word样式 3. 激活模板 4. 测试表单模板效果 5. Word模板字段校验规则 - Online表单自定义样式 1. 介绍 2. 表单样式自定义 3. 表单样式模板命名 4. 表单样式上传 5. 表单样式选择 - 数据库表导入表单 # Online表单高级应用 ## 一、Online表单模板设计 ### 1.Word表单模板设计 请假单 ![](https://img.kancloud.cn/31/f4/31f4d6b52ae0146f39c78badae6a88ae_551x192.png) 表单要关联数据表中的字段使用#{字段名}来表示 ### 2.上传Word表单模板/复制word样式 通过word模板上传或者直接复制word格式到编辑器中。 注意: 上传Word模板,需要安装Jacob COM组件 ![](https://img.kancloud.cn/7d/3c/7d3cb9001322bb011068668788738b55_618x478.png) ![](https://img.kancloud.cn/75/52/7552d968943f4d51d0b5c2c4626a1141_848x574.png) ### 3.激活模板 ![](https://img.kancloud.cn/54/d3/54d3c36f8649daecae9f01e2d34c2676_484x153.png) ![](https://img.kancloud.cn/7c/c9/7cc90ff3807cc4672a9c3e69ebad811d_436x160.png) ### 4.测试表单模板效果 进入表单列表页面,点击添加页面,查看效果 ![](https://img.kancloud.cn/7b/10/7b10368cce10e3e179911680859ac1c8_616x473.png) ![](https://img.kancloud.cn/3d/e7/3de75bb3efd862f4b6bca908622a42a6_615x475.png) ### 5.Word模板字段校验规则 整体的设计思想延续ValidForm的表达式规则,支持自定义 | 定义 |表达规则 | | -------- | ----- | ---- | | 不能为空!| *| | *6-16| *6-16| | 请填写数字!| n| | 请填写6到16位数字!| n6-16| | 不能输入特殊字符!| s| | 请填写邮政编码!| P| | 请填写手机号码!| m| | 邮箱地址格式不对!| e| | 请填写网址!| url| | ## 二、Online表单自定义样式 ### 1.介绍 Online表单通过风格切换,实现一个表单多种展现风格;Online表单风格支持用户自定义。 ### 2.表单样式自定义 下载默认风格,修改html页面和样式。 ![](https://img.kancloud.cn/a2/75/a275aab573ab1674a959a65ba1f1c6a2_1093x470.png) 下载模板目录和文件格式如下: ![](https://img.kancloud.cn/a7/8d/a78d037eebd0887f9a1766816dcc83ab_658x116.png) ![](https://img.kancloud.cn/aa/57/aa570e38d7c6a0388fde5ab629ac3cc0_317x165.png) ### 3.表单样式模板命名 注意: 文件名是固定的,模板内容可以自行修改 |序号 | 模板内容| 文件名| | -------- | ----- | ---- | | 1| 单表模型,表单模板名字| jform.ftl| | 2| 一对多模型、一对一模型,表单模板名字| jformunion.ftl| | 3| 列表模板名字| autolist.ftl| ### 4.表单样式上传 选择自定义风格ZIP文件,设置类型通用,激活状态上传。 ![ ](https://img.kancloud.cn/0e/13/0e139da879ca94f4f56d9cf0ad309305_925x589.png) ### 5.表单样式选择 模板上传后在【Online表单开发】功能编辑页面,选择表单风格 ![](https://img.kancloud.cn/a1/d9/a1d95a134d61245f56d0fb4801a67e9d_928x613.png) 点击【Online表单开发】列表页面【功能测试】可查看表单效果 ## 三、数据库表导入表单 根据数据库存在的物理表来生成智能表单的配置。 注意: 已经存在表需要遵循online规则,主键必须是ID, 且是唯一主键。 ####① 点击[数据库表生成表单]。 ![](https://img.kancloud.cn/a9/a0/a9a00aa259a6f7df173434055dc66c56_1069x297.png) ####② 选择要生成智能表单的数据库表 ![](https://img.kancloud.cn/5d/d8/5dd80b87421ad3a6875d81a575aeeafe_443x597.png)