WEB项目中自定义表单的设计与实现

在我们的Web项目开发中，充斥着大量的列表操作，对列表记录的增加，删除，修改操作，那么如何来设计自定义表单呢？

1. 表单的设计

表单的设计可通过HTMLEditor编辑器来完成，这样做的好处是可以直接利用其HTML文本来显示增加记录的页面，一举两得，但要注意在HTMLEditor编辑器控件主要包括：文本，多文本，数字，日期，文件上传（附件），下拉框（静态和动态）等，文件上传可通过我上一篇博客的思路来完成，下拉框静态比较简单，动态可利用select控件的自定义属性如SQL来定义，利用Ajax技术，将执行后的SQL结果替换到原来的下拉框即可实现，如下图：

定义入口：

定义表单：

 
 定义完后就在后台利用正则表达式将HTMLEditor内容进行分析，并动态建立表单即可

1. 数据的增加，删除与修改

数据增加界面要注意控件的渲染，如日期控件应该自动加上日期选择框，并且应该根据类型给各个控件加上校验，保证数据的准确性，如下图是对日期控件的渲染效果（根据DOM属性分析即可）：

 提交表单后，在后台进行字串分析，将数据插入到表中即可。

要注意的细节问题包括：

• 表单动态建表中应该给每个表加个主键，以方便进行删除修改操作
• 控件的渲染和动态校验是关键的，不可马虎

实例Demo程序地址：http://code.faqee.com/form/list.jsp

源码地址：http://code.faqee.com/code.jsp?mydir=/src/form/

评论

2 楼 luoyexiaozhu 2016-01-05  

最近在学表单这一块，没有思路，能发给我一份学习一下吗[e-mail]，谢谢了

1 楼 lufei1344 2014-10-13  

下载地址不能用了，[e-mail]邮箱