json实现页面局部刷新

第一步,导入需要的JAR包
//struts2-json-plugin-2.1.8.jar
//json-lib-2.1.jar
//jquery-1[1].3.2.min.js

/*
 *实体类
 */
public class Goods implements java.io.Serializable {

	private Integer id;
	private String goodName;
	private Integer goodType;
}
//DAO
public class GoodDao {
	public List<Goods> loadFirst(){
		Configuration conf=new Configuration().configure();
		SessionFactory sf=conf.buildSessionFactory();
		Session session=sf.openSession();	
		List<Goods> goodsList=session.createCriteria(Goods.class).add(Restrictions.eq("goodType", 0)).list();
		session.close();
		return goodsList;
	}
	public List<Goods>loadSecond(Integer id){
		Configuration conf=new Configuration().configure();
		SessionFactory sf=conf.buildSessionFactory();
		Session session=sf.openSession();	
		
		List<Goods>goodsList=session.createCriteria(Goods.class).add(Restrictions.eq("goodType", id)).list();
		session.close();
		return goodsList;
	}
}
//ACTION
public class GoodAction extends ActionSupport {
	private GoodDao goodDao=new GoodDao();
	private List<Goods>firstList=new ArrayList();
	private List<Goods>secondList=new ArrayList();
	private Goods good;
	private Integer id;//一级分类ID
        
	// 加载一级分类
    public String loadBlock(){
    	firstList=goodDao.loadFirst();
    	return "loadFirst";
    }
       
        //根据所选一级分类来加载二级分类  
    public String searchSecond(){
    	secondList=goodDao.loadSecond(id);
    	return "success";
    }
}

//STRUTS.xml配置
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.1.7//EN"
    "http://struts.apache.org/dtds/struts-2.1.7.dtd">
  <struts>
       <package name="default" extends="json-default">//继承json-default
             <action name="goodAction" class="action.GoodAction">
                   <result name="loadFirst">/goods.jsp</result>
                   <result type="json" ></result>//定义成json类型的
             </action>
       </package>
  </struts>
//在struts2-json-plugin-2.1.8.jar的JsonPlugin.tld中定义了如下包(已经定义过了):
<struts>
    <package name="json-default" extends="struts-default">
        <result-types>
            <result-type name="json" class="org.apache.struts2.json.JSONResult"/>
        </result-types>
        <interceptors>
            <interceptor name="json" class="org.apache.struts2.json.JSONInterceptor"/>
        </interceptors>
    </package>
</struts>

//页面
<s:form action="" theme="simple">
            <s:label value="一级分类:"/>
            <s:select list="firstList" listKey="id" listValue="goodName"  headerKey="-1" headerValue="请选择" id="firstBlock" cssClass="select"></s:select> <br/>
            <s:label value="二级分类:" />
            <s:select list="secondList" listKey="id" listValue="goodName" headerKey="-1" id="secondBlock" headerValue="请选择" cssClass="select"></s:select>  
       </s:form>
//JS
<script type="text/javascript" language="javascript">
     $(function(){
		   $("#firstBlock").change(function(){ 
				  $.ajax({
							url:"goodAction!searchSecond",
							type:"post",
							dataType:"json",
							data:{"id":$("#firstBlock").val()},
							error:function (XMLHttpRequest, textStatus, errorThrown) {
							alert(XMLHttpRequest.responseText);
							},
							success:showContent
				  }); 		 
		   });	
     });
 function showContent(data){
    document.getElementById('secondBlock').options.length=1;
    for(var i=0;i<data.secondList.length;i++){
       document.getElementById('secondBlock').options.add(new Option(data.secondList[i].goodName,data.secondList[i].id));
       alert(data.secondList[i].id);
    } 
  }	      

上面实现的逻辑是,当第一次加载页面时把一级分类读取出来,此时二级分类为空。当用户点某个一级分类时根据此一级分类ID读取出数据库中该分类下的二级分类………………当然用的是局部刷新。呵呵

你可能感兴趣的:(java,jquery,json,Ajax,struts)