Domino平台如何实现自定义表单
Domino平台如何实现自定义表单
做过Domino程序开发的程序猿们都知道一个事情,在这个平台上开发Web的表单是个头疼的事儿。因为开发表单必须使用设计器,而设计器是没法做到所见即所得。一般是在DW里编辑好页面,一点一点往表单里粘贴,还是挺麻烦的。很多时候,系统的表单页面是需要修改的,甚至需要由维护人员来修改,这就有点麻烦了。能不能实现一种设计,系统的表单页面可以灵活的进行修改,而且不是通过设计器来完成,就像用Web上的多文本编辑器一样修改,那多方便呀?
我们先来分析一下,HTML页面包含的元素。一般的表单都是具备<html><head><body><form>这些基本元素的。可视部分都在<body>中,与使用这进行数据交互的一般在<form>中(其实没有<form>标签也可以提交数据)。就我们此文来讲,应该是修改外观及form表单中的各种控件。有时候甚至只需要增删文字。而这些内容通通位于<body>标签内。
这里有个比较麻烦的问题,如何读取或为动态表单中的各控件赋值?如何与后台数据库中的字段对应上?如何提交动态表单的数据?
要想实现Web上编辑制作自定义表单,首先我们要集成一个多文本编辑器。笔者就用CKEditor举例来说吧(本文不涉及怎么集成CKEditor)。 如下图所示,这是笔者在Web编辑器中设计的一个用于输入的表单。为了方便设计的很简单,甚至有点磕碜!这是在编辑状态下显示的。
再看下面的图,这是嵌入网页中后,在浏览器中显示的样子,与编辑器中看到的基本一致。当然,这只是实现了第一步。
输入数据后,还要把数据上传到服务器上。此时应该点击保存按钮触发一个提交的动作。对应的保存按钮就要写上一点JS代码了。
加上这些JS代码后,只需利用ajax,将JSON格式的数据提交到服务器端即可。是不是很简单啊?在服务器端,笔者再利用xagent将JSON数据转换为POJO对象,然后利用JAVA的反射机制就可以实现数据的保存了,甚至都不用关心字段的名称。当然这只是简单的一种场景,如果是复杂的场景就要对数据进行处理了。
刚才回看了下,截图里的代码格式都是乱的,而且也不清晰,其实就是将form序列化成JSON格式的数据。
完整的例子如下:
<script type="text/javascript">
$(function() {
$("#btsave").click(function() {
var params = $("#frminfo").serializeObject();
console.info(params);
})
});
$.fn.serializeObject = function() {
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name]) {
if (!o[this.name].push) {
o[this.name] = [ o[this.name] ];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
}
</script>
注意事项:
1.代码里最好不要有注释。
2.CKEditor会把文本中的换行符过滤掉,因此你在编辑器写好的代码上传服务器后再打开会发现换行符都没了,因此推荐在DM中编辑好后再粘贴到CKEditor中保存。
以上是自定义表单中数据的提交,提交不算完事,还有数据的回显如何解决那?
<未完>