懒人懒法

最近开始一个新的项目,在原来的系统下定制,客户有一个新的需求,是关于人机交互方面的,客户想要输入编号,自动补全编号所代表的信息(就像输入法中,你输入拼音出来待选字符一样)。本来这个功能也没什么,ajax就能轻松搞定,偏偏不巧,我们的系统在业务方面下的功夫比在这些人机交互上要多,对于ajax系统框架还不能很好的支持,于是自己利用闲暇时间稍微了解了下ajax滴东西,做了一个在现有系统框架下自动补全滴Demo。
拿来主义
客户的这公司肯定是需要一个好的Ajax的框架,而Ajax本质上是JavaScript与其他技术的一个组合,重点还是在JavaScript上,其他技术只是规范了数据这部分类人(个人理解啊)所以决定先从JavaScript入手。平时呢没事自己就会去技术社区泡泡,了解到JavaScript有一些很好滴框架JQueryExtJs等,而且也注意MS在自己的MVC正式版里面也引进人了一个Js框架JQuery,至于为什么自己就不的而知了。公司的技术选型就是微软体系的,那跟着微软走是肯定的啦,所以Js的框架就是定量JQuery了,后来发现还真是没错,较ExtJs而言,JQuery库函数功能强大,也有很多插件支持,不过可能在UI上略弱于ExtJs(仅限于个人了解)。

Js框架定了为JQuery了,剩下的工作就是如何用JQuery来实现自动补全,很容易的找到了一个AutoComplete的plug-in,看看官方的API,自己做了几个Demo,几乎将这个Plug-in的几种应用场景熟悉了一下。

在大概熟悉了JQuery滴AutoComplete后,就该考虑如何整合到现有的框架下了。
Open-Closed Principle,OCP
在考虑如何整合到现有的系统的时候,当时我主要考虑有两个问题:引入JQuery,系统中原有的Js函数库会不会受影响?需不需要修改系统框架,如果修改会对已有的代码带来哪些影响?对于第一个,肯定会,因为JQuery很强大,会很大程度上改变你使用Js的习惯,带来很多便利,但是对于已有的code不错任何调整也能继续使用!对于第二个问题我就拿不准了,当时首先想到的就是要理一遍现在系统框架的代码,当打开现有的框架源代码后,立马就觉得这方法不太可行,so many codes!对于一个懒人来说看这么多代码是无法接受滴!

这时候想起来以前看过滴面向对象设计(OOD)的原则,有一个叫“对于扩展开放,对于修改封闭”也就是OCP。有没有一种不改变或者是仅少量的改变现有系统框架又能实现客户需求的方式呢,经过一番研究还真有!JQuery可以直接操作Dom对象,框架生成到客户端也就是Dom,我不在服务器端动手术,我直接在客户端做手脚,将客户需要的数据通过一个Ajax的请求,去访问一个专门的查询页面,得到结果然后去更新客户端的Dom对象,一切都解决了,虽然不是那么完美!

当然这只是我想到的一种临时解决方案,日新月异的新技术,客户层出不穷的新需求,这一次是自动补全,下一次就是更优雅的图形报表,框架的升级肯定是在所难免。


5 Comments

fuzhong Windows XP Internet Explorer 7.0 on 2009年07月2日 at 23:17.

Do poject not adapt you,it is a pity that you not do professional coder!

回复

Felix Windows XP Firefox 3.0.3 on 2009年07月3日 at 12:30.

:mrgreen:

回复

fuzhong Windows XP Internet Explorer 7.0 on 2009年07月3日 at 13:24.

:shock: 边栏的淘宝广告太丑了

回复

felix Windows XP Firefox 3.5 on 2009年07月4日 at 11:44.

:grin: 就是放着不然太空了

有时间在整理那个吧

回复

jquery reference Windows XP Firefox 3.5.3 on 2012年01月16日 at 01:21.

This post was just what I was looking for. Thanks!

回复

Leave Your Comment

Your email will not be published or shared. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>