AJAX中使用JSON

在Java开发中，如果要使用JSON进行开发，需要一些支持，这里使用JSON-lib进行处理。

在开发AJAX中，进入了Servlet或Action，需要将查询出的数据转换为JSON对象，再将JSON对象转换为字符串输出回页面

 

示例：联动菜单

（1）建立项目，

（2）加入SSH支持

（3）处理jar包

删除asm-2.2.3.jar、ehcache-1.1.jar，加入commons-pool.jar支持jar包

（4）配置struts与spring的插件支持

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE struts-config PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 1.2//EN" "http://struts.apache.org/dtds/struts-config_1_2.dtd">

 

<struts-config>

       <data-sources />

       <form-beans>

       </form-beans>

 

       <global-exceptions />

       <global-forwards />

       <action-mappings>

       </action-mappings>

       <controller

              processorClass="org.springframework.web.struts.DelegatingRequestProcessor">

       </controller>

       <message-resources

              parameter="org.liky.json.struts.ApplicationResources" />

       <plug-in className="org.springframework.web.struts.ContextLoaderPlugIn">

              <set-property property="contextConfigLocation" value="/WEB-INF/classes/applicationContext.xml" />

       </plug-in>

</struts-config>

 

（5）配置数据源及dbc

<?xml version="1.0" encoding="UTF-8"?>

<beans xmlns="http://www.springframework.org/schema/beans"

       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

       xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-2.0.xsd">

 

 

       <bean id="dataSource"

              class="org.apache.commons.dbcp.BasicDataSource">

              <property name="driverClassName"

                     value="org.gjt.mm.mysql.Driver">

              </property>

              <property name="url" value="jdbc:mysql://localhost:3306/ajax"></property>

              <property name="username" value="root"></property>

              <property name="password" value="mysqladmin"></property>

       </bean>

       <bean id="sessionFactory"

              class="org.springframework.orm.hibernate3.LocalSessionFactoryBean">

              <property name="dataSource">

                     <ref bean="dataSource"></ref>

              </property>

              <property name="hibernateProperties">

                     <props>

                            <prop key="hibernate.dialect">

                                   org.hibernate.dialect.MySQLDialect

                            </prop>

                            <prop key="hibernate.show_sql">true</prop>

                     </props>

              </property>

              <property name="mappingResources">

                     <list>

                            <value>org/liky/json/pojo/Areaplus.hbm.xml</value>

                            <value>org/liky/json/pojo/Area.hbm.xml</value>

                     </list>

              </property>

       </bean>

       <bean id="hibernateTemplate"

              class="org.springframework.orm.hibernate3.HibernateTemplate">

              <property name="sessionFactory">

                     <ref bean="sessionFactory"></ref>

              </property>

       </bean>

       <bean id="areadaoimpl" class="org.liky.json.dao.impl.AreaDAOImpl">

              <property name="hibernateTemplate">

                     <ref bean="hibernateTemplate"></ref>

              </property>

       </bean>

 

</beans>

 

（6）生成pojo映射

package org.liky.json.pojo;

 

 

 

public class Areaplus implements java.io.Serializable {

 

       // Fields

 

       private Integer id;

 

       private Area area;

 

       private String title;

 

       // Constructors

 

      

       public Areaplus() {

       }

 

      

       public Areaplus(Area area) {

              this.area = area;

       }

 

      

       public Areaplus(Area area, String title) {

              this.area = area;

              this.title = title;

       }

 

       // Property accessors

 

       public Integer getId() {

              return this.id;

       }

 

       public void setId(Integer id) {

              this.id = id;

       }

 

       public Area getArea() {

              return this.area;

       }

 

       public void setArea(Area area) {

              this.area = area;

       }

 

       public String getTitle() {

              return this.title;

       }

 

       public void setTitle(String title) {

              this.title = title;

       }

 

}

package org.liky.json.pojo;

 

import java.util.HashSet;

import java.util.Set;

 

 

 

public class Area implements java.io.Serializable {

 

       // Fields

 

       private Integer id;

 

       private String title;

 

       private Set areapluses = new HashSet(0);

 

       // Constructors

 

      

       public Area() {

       }

 

      

       public Area(String title) {

              this.title = title;

       }

 

      

       public Area(String title, Set areapluses) {

              this.title = title;

              this.areapluses = areapluses;

       }

 

       // Property accessors

 

       public Integer getId() {

              return this.id;

       }

 

       public void setId(Integer id) {

              this.id = id;

       }

 

       public String getTitle() {

              return this.title;

       }

 

       public void setTitle(String title) {

              this.title = title;

       }

 

       public Set getAreapluses() {

              return this.areapluses;

       }

 

       public void setAreapluses(Set areapluses) {

              this.areapluses = areapluses;

       }

 

}

 

（7）编写DAO和实现类

package org.liky.json.dao.impl;

 

import java.util.List;

 

import org.liky.json.dao.AreaplusDAO;

import org.liky.json.pojo.Areaplus;

import org.springframework.orm.hibernate3.support.HibernateDaoSupport;

 

public class AreaplusDAOImpl extends HibernateDaoSupport implements AreaplusDAO {

 

    public List<Areaplus> findByUpid(int upid) throws Exception {

       // TODO Auto-generated method stub

       return this.getHibernateTemplate().find(

              "FROM Areaplus AS a WHERE a.area.id = ?", upid);

    }

 

}

 

package org.liky.json.dao.impl;

 

import java.util.List;

 

import org.liky.json.dao.AreaDAO;

import org.liky.json.pojo.Area;

import org.springframework.orm.hibernate3.support.HibernateDaoSupport;

 

public class AreaDAOImpl extends HibernateDaoSupport implements AreaDAO {

 

    public List<Area> findAll() throws Exception {

       // TODO Auto-generated method stub

       return this.getHibernateTemplate().find("FROM Area");

    }

 

}

 

（8）把实现配置到applicationContext.xml中

    <bean id="hibernateTemplate"

       class="org.springframework.orm.hibernate3.HibernateTemplate">

       <property name="sessionFactory">

           <ref bean="sessionFactory"></ref>

       </property>

    </bean>

    <bean id="areadaoimpl" class="org.liky.json.dao.impl.AreaDAOImpl">

       <property name="hibernateTemplate">

           <ref bean="hibernateTemplate"></ref>

       </property>

    </bean>

    <bean id="areaplusdaoimpl" class="org.liky.json.dao.impl.AreaplusDAOImpl">

       <property name="hibernateTemplate">

           <ref bean="hibernateTemplate"></ref>

       </property>

    </bean>

 

 

（9）通过一个连接，进入级联菜单显示页面，需要先查询出所有一级栏目（省份信息）

 

    private AreaDAO areadao;

 

    private AreaplusDAO areaplusdao;

 

    public void setAreadao(AreaDAO areadao) {

       this.areadao = areadao;

    }

 

    public void setAreaplusdao(AreaplusDAO areaplusdao) {

       this.areaplusdao = areaplusdao;

    }

 

   

    public ActionForward list(ActionMapping mapping, ActionForm form,

           HttpServletRequest request, HttpServletResponse response) {

       AreaForm areaForm = (AreaForm) form;// TODO Auto-generated method stub

 

       try {

           List all = this.areadao.findAll();

           request.setAttribute("all", all);

       } catch (Exception e) {

           // TODO Auto-generated catch block

           e.printStackTrace();

       }

 

       return mapping.findForward("list");

    }

 

（10）将Action配置到spring管理中

 

    <bean name="/area" class="org.liky.json.struts.action.AreaAction">

       <property name="areadao">

           <ref bean="areadaoimpl"></ref>

       </property>

       <property name="areaplusdao">

           <ref bean="areaplusdaoimpl"></ref>

       </property>

    </bean>

 

 

列表显示一级栏目

 

<%@ page language="java" pageEncoding="GBK"%>

 

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean"%>

<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html"%>

<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic"%>

<%@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles"%>

 

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html:html lang="true">

<head>

    <html:base />

 

    <title>list.jsp</title>

 

    <meta http-equiv="pragma" content="no-cache">

    <meta http-equiv="cache-control" content="no-cache">

    <meta http-equiv="expires" content="0">

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

    <meta http-equiv="description" content="This is my page">

    <!--

    <link rel="stylesheet" type="text/css" href="styles.css">

    -->

 

</head>

 

<body>

    <center>

       省份信息：

       <select name="area">

           <option value="0">

              -请选择省份-

           </option>

           <logic:iterate id="area" name="all" scope="request">

              <option value="${area.id }">

                  ${area.title }

              </option>

           </logic:iterate>

       </select>

 

       城市信息：

       <select name="plus">

           <option value="0">

              -请选择城市-

           </option>

       </select>

    </center>

 

</body>

</html:html>

 

 

 

（11）编写调用的js方法

 

    <script type="text/javascript">

       var xmlHttp ;

      

       function createXmlHttp() {

           if (window.XmlHttpRequest) {

              xmlHttp = new XmlHttpRequest();

           } else {

              xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

           }

       }

      

       function showplus(upid) {

           createXmlHttp();

           xmlHttp.onreadystatechange = showplusCallback ;

           xmlHttp.open("POST","area.do?status=showplus&upid="+upid);

           xmlHttp.send(null);

       }

      

       function showplusCallback() {

      

       }

      

   

    </script>

 

（12）完成后台Action中的代码

由于需要用到Java对JSON的解析处理，因此为项目导入JSON支持jar包

 

 

    public ActionForward showplus(ActionMapping mapping, ActionForm form,

           HttpServletRequest request, HttpServletResponse response) {

       AreaForm areaForm = (AreaForm) form;// TODO Auto-generated method stub

 

       List all = null;

       try {

           all = this.areaplusdao.findByUpid(areaForm.getUpid());

       } catch (Exception e) {

           // TODO Auto-generated catch block

           e.printStackTrace();

       }

 

       // 将查询的数据处理成为JSON对象

       // 将JSON-lib的支持jar包导入到项目中

       if (all != null && all.size() > 0) {

           Iterator iter = all.iterator();

           // 定义一个JSON对象

           JSONObject root = new JSONObject();

 

           // 定义一个JSON数组，保存所有的Areaplus的数据

           JSONArray areapluses = new JSONArray();

 

           while (iter.hasNext()) {

              Areaplus a = (Areaplus) iter.next();

              // 定义数组中的对象

              JSONObject areaplus = new JSONObject();

              // 为JSON的areaplus加入属性

              areaplus.put("id", a.getId());

              areaplus.put("title", a.getTitle());

              // 将Object对象加入到数组中

              areapluses.add(areaplus);

           }

           // 将数组加入到root中

           root.put("areapluses", areapluses);

           // 定义PrintWriter对象，返回数据

           // 处理乱码

           response.setCharacterEncoding("GBK");

           try {

              PrintWriter out = response.getWriter();

              out.print(root.toString());

              out.close();

           } catch (IOException e) {

              // TODO Auto-generated catch block

              e.printStackTrace();

           }

 

       }

 

       return null;

 

 

（13）在回调函数中取得返回的数据，并转换为JSON对象，同时进行处理。

可以直接使用JSON提供的json.js中的方法，将一个标准JSON对象的字符串转换为一个js对象

 

    <script type="text/javascript" src="json.js"></script>

    <script type="text/javascript">

       var xmlHttp ;

      

       function createXmlHttp() {

           if (window.XmlHttpRequest) {

              xmlHttp = new XmlHttpRequest();

           } else {

              xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

           }

       }

      

       function showplus(upid) {

           createXmlHttp();

           xmlHttp.onreadystatechange = showplusCallback ;

           xmlHttp.open("POST","area.do?status=showplus&upid="+upid);

           xmlHttp.send(null);

       }

      

       function showplusCallback() {

           if (xmlHttp.readyState == 4) {

              // 接收数据

              var str = xmlHttp.responseText ;

              // 转换为对象

              var obj = str.parseJSON();

              // 先将下拉列表清空

              var select = document.getElementById("plus") ;

              select.options.length = 1 ;

              // 循环返回的areaplus数据

              for (var i = 0 ; i < obj.areapluses.length ;i ++） {

                  var areaplus = obj.areapluses[i];

                  // 建立option

                  var option = document.createElement("option");

                  // 设置value属性

                  option.setAttribute("value",areaplus.id);

                  // 设置显示内容

                  option.appendChild(document.createTextNode(areaplus.title));

                  // 设置下拉列表

                  select.appendChild(option);              

              }

             

           }

       }

      

   

    </script>

 

 

（14）启动测试后，发现导入commons-collections-2.1.1包中的类并不全，需要将单独下载的完全版的这个jar包替换到项目中