Oracle ADF中实现输入框字数统计功能
需求:在我们的信息系统中,为了用户体验,通常会有如下图的字数统计功能:
在传统的jsp页面里实现这样的功能,相信各位同学都会轻车熟路,但是当我们使用了oracle adf框架后,实现这个功能,尽然花费了我一天的时间,原因是,企图使用oracle adf自己封装的js api实现,结果是徒劳。原因如下:
先来看一下源代码:
分析:
1、在这个页面中,我使用了oracle adf js api查找一个页面对象,设置其值,但af:clientListener这个标签的监听事件类型设为type="keyUp",根本不是想象的那样(当键盘键弹起时触发),只有当焦点移开af:inputText备注框时,才能触发。
2、oracle adf js api都是发送一些异步的ajax请求,上面的这个例子在备注输入框失去焦点的时候也能统计出结果,但是,似乎是由于ajax 异步请求后台处理的原因,统计很不流畅,甚至有很大的延迟,用户体验非常差。
基于上述两个原因,我继续寻求其他的解决办法,我在想,这样统计字数的功能,在使用jsp或html的时候,我们通常都是用前台的js技术解决,根本不需要与后台服务器交互,那么,在这里,我们能不能也这样处理呢?想到这里,我的思路豁然开朗,我借助firebug的强大功能,分析了上面代码在浏览器中解析后的结构,见如下图:
这样以来,我将上面的代码改为如下代码,最终达到了我们想要的效果:
代码里都做了详细的注释,我这里就不在赘述。值得一提的是,在最后ie和firefox兼容性上遇到了点麻烦,对于html的span标记的操作,firefox不支持innerText属性,最后改为textContent,但对于对undefined的比较变量,要使用typeof进行转换,是我之前不知道的知识点,经过查找资料解决了兼容性问题。
总结:
从上面的例子可以看到,对于oracle adf的js api如果在使用时不是那么得心应手,我们通过上面的方法,同样可以回归到最基础的html、js方式进行处理,这样就突破的oracle adf框架的限制,实现许多我们自己想要的功能。
值得一提的是,如果我们确定要使用原生的js api来操作html dom树实现自己的功能,兼容性是个问题,这就要求我们借助httpwatch(ie下使用)和firebug(firefox下使用)这些工具进行相应的调试,这一定程度上对我们的开发带来了难度,因此,这就要求我们对基础知识有足够的掌握,才能利用好任何的开发框架,在提高效率的同时,又能利用基础知识解决框架不能解决的难题。