在上一个随笔中,介绍AJAX的一个简单实例,在这篇中主要是说一下使用Json来将后台取得的数据显示到前台页面。可以说这种方法应该是实现无刷新分页的基础,而且在开发过程中经常被用到。这里的后台部分由JAVA来实现。
这个例子也在上一篇中那个项目中实现。新建一个SecondTest.html页面,定义一个按钮,并给这个按钮绑定事件ajaxJson()。在JS中实现AJAX,这里的AJAX相对于上一篇中的,我做了简单的封装,将原有的代码分成三个方法,分别是create()、callback()、run()。
create方法是用来创建XMLHttp对象的,callback是用来实现回调函数的,run方法是核心方法。具体代码如下:
create():
callback():
function run(url){ create(); xmlHttp.open("POST",url,true); xmlHttp.onreadystatechange=callback; xmlHttp.send(); }
以上三个方法写好后,在ajaxJson()方法中直接调用run方法并将请求当参数传入进去。代码如下:
function ajaxJson(){ run("test.do?method=jsonTest&&msg="+new Date()); }
在AjaxController类的中新建jsonTest方法,在JAVA中实现Json是需要Json架包的,Json的架包有:json-lib-2.3-jdk15.jar,ezmorph-1[1].0.6.jar,commons-logging-tests.jar,commons-logging-api-1.1.1.jar,commons-logging-adapters-1.1.1.jar,commons-logging-1.1.1-sources.jar,commons-logging-1.1.1-javadoc.jar,commons-logging-1.1.1.jar,commons-lang.jar,commons-collections-3[1].2.1.jar,commons-beanutils-core.jar,commons-beanutils-bean-collections.jar,commons-beanutils.jar。看着有点多哈,可以自己去CSDN上面找,我试着删掉一些,但发现少了会不好使,所以为了保险还是把这些都加进去吧。
在开发过程中一般数据都是从数据库中取出来的,习惯性的我们会在程序中将取出的数据存到List中,而Json架包中正好有封装好的方法能将List转换为Json。在这个例子中我们自己制造一些假数据放到List中,然后再将List转换为Json,再返回给前台。代码如下: