extjs 省市区三级联动combobox

来源:互联网 发布:sql server添加默认值 编辑:程序博客网 时间:2024/05/16 12:21

原文地址: http://blog.csdn.net/flash8627/article/details/6453526

 

 

测试主文件JSP:

 

 

[xhtml] view plaincopy
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  3. <html>  
  4.     <head>  
  5.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
  6.         <title>省市区级联combobox测试</title>  
  7.         <jsp:include page="common-top.jsp" />  
  8.         <mce:script type="text/javascript" src="script/ComboboxTest.js" mce_src="script/ComboboxTest.js"></mce:script>  
  9.     </head>  
  10.     <body style="padding:8px;" mce_style="padding:8px;">  
  11.     </body>  
  12. </html>  

 

 

ComboboxTest.js

 

[javascript] view plaincopy
  1. Ext.ns("com.gwtjs");  
  2. var resourceNo =1;  
  3. com.gwtjs.ProvinceCombo = Ext.extend(Ext.form.ComboBox,{  
  4.     oldId:"",  
  5.     lock:false,  
  6.     store:null,  
  7.     constructor:function(_cfg){  
  8.         if(!_cfg)  
  9.             _cfg = {};  
  10.         this.Model = Ext.data.Record.create([ "id""provinceID""name" ]);  
  11.         this.reader = new Ext.data.JsonReader({  
  12.             root:"items"  
  13.         },this.Model);  
  14.         this.store = new Ext.data.Store({  
  15.             reader:this.reader,  
  16.             proxy : new Ext.data.HttpProxy({  
  17.                 url : '../getProvinces.action'  
  18.             })  
  19.         });  
  20.         Ext.apply(this,_cfg);  
  21.         com.gwtjs.ProvinceCombo.superclass.constructor.call(this, {  
  22.             label:"省",  
  23.             id:this.oldId+"province",  
  24.             store:this.store,  
  25.             editable:!this.lock,  
  26.             listWidth : 160,  
  27.             name : "province",  
  28.             hiddenName : 'province',  
  29.             valueField : "id",  
  30.             displayField : "name",  
  31.             triggerAction : 'all',  
  32.             mode : 'remote',  
  33.             listeners: {  
  34.                 'select'function(combo, record, number) {  
  35.                     console.warn("select",this);  
  36.                     var o = this.ownerCt.ownerCt.ownerCt.cityCombo;  
  37.                     Ext.apply(o.store.baseParams,{fatherID:record.get("provinceID")});  
  38.                     o.store.load();  
  39.                     console.dir(o.store.baseParams);  
  40.                 },  
  41.                 'blur':function(){  
  42.                     //console.warn("blur",this);  
  43.                 }  
  44.             }  
  45.         });  
  46.     }  
  47. });  
  48. com.gwtjs.CityCombo = Ext.extend(Ext.form.ComboBox,{  
  49.     oldId:"",  
  50.     lock:false,  
  51.     store:null,  
  52.     constructor:function(_cfg){  
  53.         if(!_cfg)  
  54.             _cfg = {};  
  55.         this.Model = Ext.data.Record.create([ "id""name""cityID""fatherID" ]);  
  56.         this.reader = new Ext.data.JsonReader({  
  57.             root:"items"  
  58.         },this.Model);  
  59.         this.store = new Ext.data.Store({  
  60.             baseParams:{fatherID:null},  
  61.             reader:this.reader,  
  62.             proxy : new Ext.data.HttpProxy({  
  63.                  url : '../getCitys.action'  
  64.             })  
  65.         });  
  66.         Ext.apply(this,_cfg);  
  67.         com.gwtjs.CityCombo.superclass.constructor.call(this, {  
  68.             id:this.oldId+"city",  
  69.             store:this.store,  
  70.             editable:this.lock,  
  71.             listWidth : 280,  
  72.             name : "name",  
  73.             hiddenName : 'name',  
  74.             valueField : "id",  
  75.             displayField : "name",  
  76.             triggerAction : 'all',  
  77.             mode : 'remote',  
  78.             listeners: {  
  79.                 'select'function(combo, record, number) {  
  80.                     console.warn("select",this);  
  81.                     var o = this.ownerCt.ownerCt.ownerCt.areaCombo;  
  82.                     Ext.apply(o.store.baseParams,{fatherID:record.get("cityID")});  
  83.                     o.store.load();  
  84.                     console.dir(o.store.baseParams);  
  85.                 },  
  86.                 'blur':function(){  
  87.                     //console.warn("blur",this);  
  88.                 }  
  89.             }  
  90.         });  
  91.     }  
  92. });  
  93. com.gwtjs.AreaCombo = Ext.extend(Ext.form.ComboBox,{  
  94.     oldId:"",  
  95.     lock:false,  
  96.     store:null,  
  97.     constructor:function(_cfg){  
  98.         if(!_cfg)  
  99.             _cfg = {};  
  100.           
  101.         this.Model = Ext.data.Record.create([ "id""name""areaID""fatherID" ]);  
  102.         this.reader = new Ext.data.JsonReader({  
  103.             root:"items"  
  104.         },this.Model);  
  105.         this.store = new Ext.data.Store({  
  106.             baseParams:{fatherID:null},  
  107.             reader:this.reader,  
  108.             proxy : new Ext.data.HttpProxy({  
  109.                  url : '../getAreas.action'  
  110.             })  
  111.         });  
  112.         Ext.apply(this,_cfg);  
  113.         com.gwtjs.AreaCombo.superclass.constructor.call(this, {  
  114.             id:this.oldId+"area",  
  115.             store:this.store,  
  116.             editable:this.lock,  
  117.             listWidth : 280,  
  118.             name : "area",  
  119.             hiddenName : 'area',  
  120.             valueField : "id",  
  121.             displayField : "name",  
  122.             triggerAction : 'all',  
  123.             mode : 'remote'  
  124.         });  
  125.     }  
  126. });  
  127. com.gwtjs.TouristRouteForm = Ext.extend(Ext.form.FormPanel,{  
  128.     oldId:"",  
  129.     url : "../editorTouristRoute.action",  
  130.     plain:true,//baseCls:"x-plain",  
  131.     lock:false,  
  132.     provinceCombo:null,  
  133.     cityCombo:null,  
  134.     areaCombo:null,  
  135.     constructor:function(_cfg){  
  136.         if(!_cfg)  
  137.             _cfg = {};  
  138.         this.provinceCombo = new com.gwtjs.ProvinceCombo({  
  139.             oldId:"P_",  
  140.             lock:false  
  141.         });  
  142.         this.cityCombo = new com.gwtjs.CityCombo({  
  143.             oldId:"C_",  
  144.             lock:false  
  145.         });  
  146.         this.areaCombo = new com.gwtjs.AreaCombo({  
  147.             oldId:"A_",  
  148.             lock:false  
  149.         });  
  150.         Ext.apply(_cfg,{  
  151.             title:"省市区级联combobox测试",  
  152.             labelAlign : 'right',  
  153.             labelWidth:62,  
  154.             border:false,  
  155.             frame : true,  
  156.             defaults : {  
  157.                 layout:"column",  
  158.                 border:false,  
  159.                 anchor : "100%"  
  160.             },  
  161.             items:[{  
  162.                 defaults:{  
  163.                     layout:"form",  
  164.                     columnWidth:'.33'  
  165.                 },  
  166.                 items:[{  
  167.                     items:this.provinceCombo  
  168.                 },{  
  169.                     items:this.cityCombo  
  170.                 },{  
  171.                     items:this.areaCombo  
  172.                 }]  
  173.             }]  
  174.         });  
  175.         Ext.apply(this,_cfg);  
  176.         com.gwtjs.TouristRouteForm.superclass.constructor.call(this, _cfg);  
  177.     }  
  178. });  
  179. Ext.onReady(function(){  
  180.     var layout = new com.gwtjs.TouristRouteForm();  
  181.       
  182.     layout.render(Ext.getBody());  
  183. });  

 

 

JAVA   Model

ComboArea.java

 

[java] view plaincopy
  1. /* 
  2.  * To change this template, choose Tools | Templates 
  3.  * and open the template in the editor. 
  4.  */  
  5. package com.gwtjs.model;  
  6. /** 
  7.  * <h2 style="color:#060;" mce_style="color:#060;">区域-县-地区县-区</h2> 
  8.  *  
  9.  * @hibernate.class table="t_combo_area" 
  10.  * @author Administrator 
  11.  *  
  12.  */  
  13. public class ComboArea {  
  14.     /** 
  15.      * @hibernate.id generator-class="native" 
  16.      */  
  17.     private int id;  
  18.     /** 
  19.      * @hibernate.property 
  20.      */  
  21.     private Integer areaID;  
  22.     /** 
  23.      * @hibernate.property type="java.lang.String" length="60" column="area" 
  24.      */  
  25.     private String name;  
  26.     /** 
  27.      * @hibernate.property 
  28.      */  
  29.     private Integer fatherID;  
  30.     public Integer getAreaID() {  
  31.         return areaID;  
  32.     }  
  33.     public void setAreaID(Integer areaID) {  
  34.         this.areaID = areaID;  
  35.     }  
  36.     public Integer getFatherID() {  
  37.         return fatherID;  
  38.     }  
  39.     public void setFatherID(Integer fatherID) {  
  40.         this.fatherID = fatherID;  
  41.     }  
  42.     public int getId() {  
  43.         return id;  
  44.     }  
  45.     public void setId(int id) {  
  46.         this.id = id;  
  47.     }  
  48.     public String getName() {  
  49.         return name;  
  50.     }  
  51.     public void setName(String name) {  
  52.         this.name = name;  
  53.     }  
  54. }  

 

 

ComboCity.java

 

[java] view plaincopy
  1. /* 
  2.  * To change this template, choose Tools | Templates 
  3.  * and open the template in the editor. 
  4.  */  
  5. package com.gwtjs.model;  
  6. /** 
  7.  * <h2 style="color:#060;" mce_style="color:#060;">城市</h2> 
  8.  *  
  9.  * @hibernate.class table="t_combo_city" 
  10.  * @author Administrator 
  11.  *  
  12.  */  
  13. public class ComboCity {  
  14.     /** 
  15.      * @hibernate.id generator-class="native" 
  16.      */  
  17.     private Integer id;  
  18.     /** 
  19.      * @hibernate.property 
  20.      */  
  21.     private Integer cityID;  
  22.     /** 
  23.      * @hibernate.property type="java.lang.String" length="60" column="city" 
  24.      */  
  25.     private String name;  
  26.     /** 
  27.      * @hibernate.property 
  28.      */  
  29.     private Integer fatherID;  
  30.     public Integer getCityID() {  
  31.         return cityID;  
  32.     }  
  33.     public void setCityID(Integer cityID) {  
  34.         this.cityID = cityID;  
  35.     }  
  36.     public int getFatherID() {  
  37.         return fatherID;  
  38.     }  
  39.     public void setFatherID(int fatherID) {  
  40.         this.fatherID = fatherID;  
  41.     }  
  42.     public Integer getId() {  
  43.         return id;  
  44.     }  
  45.     public void setId(Integer id) {  
  46.         this.id = id;  
  47.     }  
  48.     public String getName() {  
  49.         return name;  
  50.     }  
  51.     public void setName(String name) {  
  52.         this.name = name;  
  53.     }  
  54. }  

 

 

ComboProvince.java

 

 

[java] view plaincopy
  1. /* 
  2.  * To change this template, choose Tools | Templates 
  3.  * and open the template in the editor. 
  4.  */  
  5. package com.gwtjs.model;  
  6. /** 
  7.  * <h2 style="color:#060;" mce_style="color:#060;">省</h2> 
  8.  *  
  9.  * @hibernate.class table="t_combo_province" 
  10.  * @author Administrator 
  11.  */  
  12. public class ComboProvince {  
  13.     /** 
  14.      * @hibernate.id generator-class="native" 
  15.      */  
  16.     private int id;  
  17.     /** 
  18.      * @hibernate.property 
  19.      */  
  20.     private Integer provinceID;  
  21.     /** 
  22.      * @hibernate.property type="java.lang.String" length="60" column="province" 
  23.      */  
  24.     private String name;  
  25.     public int getId() {  
  26.         return id;  
  27.     }  
  28.     public void setId(int id) {  
  29.         this.id = id;  
  30.     }  
  31.     public String getName() {  
  32.         return name;  
  33.     }  
  34.     public void setName(String name) {  
  35.         this.name = name;  
  36.     }  
  37.     public Integer getProvinceID() {  
  38.         return provinceID;  
  39.     }  
  40.     public void setProvinceID(Integer provinceID) {  
  41.         this.provinceID = provinceID;  
  42.     }  
  43. }  

 

 

Struts

xml

 

[xhtml] view plaincopy
  1. <struts>  
  2.     <package name="com.gwtjs.area" extends="json-default" namespace="/management">  
  3.         <action name="getProvinces" class="areaAction">  
  4.             <result type="json" />  
  5.             <result type="json" name="input" />  
  6.         </action>  
  7.         <action name="getCitys" class="areaAction" method="findCitys">  
  8.             <result type="json" />  
  9.             <result type="json" name="input" />  
  10.         </action>  
  11.         <action name="getAreas" class="areaAction" method="findAreas">  
  12.             <result type="json" />  
  13.             <result type="json" name="input" />  
  14.         </action>  
  15.     </package>  
  16. </struts>  

 

 

Action

 

[java] view plaincopy
  1. package com.gwtjs.struts.action;  
  2. import java.util.ArrayList;  
  3. import java.util.List;  
  4. import javax.annotation.Resource;  
  5. import org.springframework.context.annotation.Scope;  
  6. import org.springframework.stereotype.Component;  
  7. import org.springframework.stereotype.Controller;  
  8. import com.gwtjs.service.AreaService;  
  9. import com.gwtjs.struts.BaseAction;  
  10. @Controller  
  11. @Scope("prototype")  
  12. @Component("areaAction")  
  13. public class AreaAction extends BaseAction {  
  14.     private static final long serialVersionUID = 4983710651693497150L;  
  15.     public List<?> items = new ArrayList<Object>();  
  16.     private Integer fatherID;  
  17.     @Resource  
  18.     private AreaService areaService;  
  19.     @Override  
  20.     public String execute() throws Exception {  
  21.         items = areaService.execute(ascProperty, isAsc);  
  22.         return SUCCESS;  
  23.     }  
  24.     public String findCitys() throws Exception {  
  25.         if (fatherID != null) {  
  26.             items = areaService.findCitys(fatherID);  
  27.         }  
  28.         return SUCCESS;  
  29.     }  
  30.     public String findAreas() throws Exception {  
  31.         if (fatherID != null) {  
  32.             items = areaService.findAreas(fatherID);  
  33.         }  
  34.         return SUCCESS;  
  35.     }  
  36.     public void setItems(List<Object> items) {  
  37.         this.items = items;  
  38.     }  
  39.     public void setFatherID(Integer fatherID) {  
  40.         this.fatherID = fatherID;  
  41.     }  
  42.     public Object getFatherID() {  
  43.         return fatherID;  
  44.     }  
  45.     public List<?> getItems() {  
  46.         return items;  
  47.     }  
  48. }  

 

 

Service

 

[java] view plaincopy
  1. package com.gwtjs.service;  
  2.   
  3. import java.util.List;  
  4.   
  5. import com.gwtjs.model.ComboArea;  
  6. import com.gwtjs.model.ComboCity;  
  7. import com.gwtjs.model.ComboProvince;  
  8.   
  9. public interface AreaService {  
  10.     public List<ComboProvince> execute(final String ascProperty, final boolean isAsc) ;  
  11.       
  12.     public List<ComboCity> findCitys(Object fatherID);  
  13.       
  14.     public List<ComboArea> findAreas(Object fatherID);  
  15. }  

 

 

[java] view plaincopy
  1. package com.gwtjs.service.impl;  
  2.   
  3. import java.util.List;  
  4.   
  5. import org.springframework.beans.factory.annotation.Autowired;  
  6. import org.springframework.stereotype.Service;  
  7.   
  8. import com.gwtjs.dao.ComboAreaManager;  
  9. import com.gwtjs.dao.ComboCityManager;  
  10. import com.gwtjs.dao.ComboProvinceManager;  
  11. import com.gwtjs.model.ComboArea;  
  12. import com.gwtjs.model.ComboCity;  
  13. import com.gwtjs.model.ComboProvince;  
  14. import com.gwtjs.model.utils.Pager;  
  15. import com.gwtjs.service.AreaService;  
  16.   
  17. @Service("areaService")  
  18. public class AreaServiceImpl implements AreaService {  
  19.       
  20.     @Autowired  
  21.     private ComboProvinceManager provinceDao;  
  22.     @Autowired  
  23.     private ComboCityManager cityDao;  
  24.     @Autowired  
  25.     private ComboAreaManager areaDao;  
  26.       
  27.     @Override  
  28.     public List<ComboProvince> execute(final String ascProperty, final boolean isAsc) {  
  29.         Pager<ComboProvince> p = provinceDao.findAll(ComboProvince.class, ascProperty, isAsc);  
  30.         return p.getEntityList();  
  31.     }  
  32.   
  33.     @Override  
  34.     public List<ComboCity> findCitys(Object fatherID) {  
  35.         return cityDao.findPropertyAll(ComboCity.class"fatherID", fatherID).getEntityList();  
  36.     }  
  37.   
  38.     @Override  
  39.     public List<ComboArea> findAreas(Object fatherID) {  
  40.         return areaDao.findPropertyAll(ComboArea.class"fatherID", fatherID).getEntityList();  
  41.     }  
  42.   
  43. }  

 

Hibernate   Dao 

 

[java] view plaincopy
  1. package com.gwtjs.dao;  
  2.   
  3. import com.gwtjs.model.ComboProvince;  
  4.   
  5. public interface ComboProvinceManager extends EntityDao<ComboProvince,Integer>{  
  6.   
  7. }  
  8. package com.gwtjs.dao;  
  9.   
  10. import com.gwtjs.model.ComboCity;  
  11.   
  12. public interface ComboCityManager extends EntityDao<ComboCity, Integer> {  
  13.   
  14. }  
  15. package com.gwtjs.dao;  
  16.   
  17. public interface ComboAreaManager extends  
  18.         EntityDao<com.gwtjs.model.ComboArea, Integer> {  
  19.   
  20. }  



 

上面的是三个Java类接口,拷贝到一起了,实现类为空的实现,只为了类型映射方便而已

EntityDao 接口

 

[java] view plaincopy
  1. /** 
  2.      * <h2>按属性查全部,无分页,无排序 - 1</h2> 
  3.      *  
  4.      * @param entityClass 
  5.      * @param attrName 
  6.      * @param attrNo 
  7.      * @return 
  8.      */  
  9.     public Pager<T> findPropertyAll(Class<T> entityClass, String attrName,  
  10.             Object attrNo);  
  11.   
  12. /** 
  13.      * <h2>按属性查全部 - 4</h2> 
  14.      * @param enterprise 企业标识 
  15.      * @param entityClass 
  16.      *            实体 
  17.      * @param attrName 
  18.      *            查询的属性名 
  19.      * @param attrNo 
  20.      *            属性值 
  21.      * @param start 
  22.      * @param limit 
  23.      * @param ascProperty 
  24.      * @param isAsc 
  25.      * @return 
  26.      */  
  27.     public Pager<T> findPropertyAll(Class<T> entityClass, Integer enterprise,  
  28.             String attrName, Object attrNo, Integer start, Integer limit,  
  29.             String ascProperty, boolean isAsc);  

EntityDaoImpl实现类

[java] view plaincopy
  1. /** 
  2.      * <h2>按属性查全部 - 1</h2> 
  3.      *  
  4.      * @param entityClass 
  5.      *            实体 
  6.      * @param attrName 
  7.      *            查询的属性名 
  8.      * @param attrNo 
  9.      *            属性值 
  10.      * @return 
  11.      */  
  12.     @Override  
  13.     public Pager<T> findPropertyAll(Class<T> entityClass, String attrName,  
  14.             Object attrNo) {  
  15.         return findPropertyAll(entityClass, attrName, attrNo, nulltrue);  
  16.     }  
  17.   
  18.     /** 
  19.      * <h2>按属性查全部 - 2</h2> 
  20.      *  
  21.      * @param entityClass 
  22.      *            实体 
  23.      * @param attrName 
  24.      *            查询的属性名 
  25.      * @param attrNo 
  26.      *            属性值 
  27.      * @param ascProperty 
  28.      * @param isAsc 
  29.      * @return 
  30.      */  
  31.     @Override  
  32.     public Pager<T> findPropertyAll(Class<T> entityClass, String attrName,  
  33.             Object attrNo, String ascProperty, boolean isAsc) {  
  34.         return findPropertyAll(entityClass, attrName, attrNo, 00,  
  35.                 ascProperty, isAsc);  
  36.     }  
  37.   
  38.     /** 
  39.      * <h2>按属性查全部 - 3</h2> 
  40.      *  
  41.      * @param entityClass 
  42.      *            实体 
  43.      * @param attrName 
  44.      *            查询的属性名 
  45.      * @param attrNo 
  46.      *            属性值 
  47.      * @param start 
  48.      * @param limit 
  49.      * @param ascProperty 
  50.      * @param isAsc 
  51.      * @return 
  52.      */  
  53.     public Pager<T> findPropertyAll(final Class<T> entityClass,  
  54.             final String attrName, final Object attrNo, final Integer start,  
  55.             final Integer limit, final String ascProperty, final boolean isAsc) {  
  56.         return findPropertyAll(entityClass, null, attrName, attrNo, start,  
  57.                 limit, ascProperty, isAsc);  
  58.     }  
  59.   
  60.     @Override  
  61.     /** 
  62.      * <h2>按属性查全部 - 4</h2> 
  63.      * @param entityClass 实体 
  64.      * @param attrName 查询的属性名 
  65.      * @param attrNo 属性值 
  66.      * @param start 
  67.      * @param limit 
  68.      * @param ascProperty 
  69.      * @param isAsc 
  70.      * @return 
  71.      */  
  72.     public Pager<T> findPropertyAll(final Class<T> entityClass,  
  73.             final Integer enterprise, final String attrName,  
  74.             final Object attrNo, final Integer start, final Integer limit,  
  75.             final String ascProperty, final boolean isAsc) {  
  76.   
  77.         Pager<T> p = new Pager<T>();  
  78.         StringBuilder sb = new StringBuilder();  
  79.         sb.append("SELECT * FROM ");  
  80.         sb.append(MyHibernateConfigurationHelper.getTableName(entityClass));  
  81.   
  82.         if (null != attrName && null != attrNo) {  
  83.             sb.append(" WHERE ");  
  84.             sb.append(attrName);  
  85.             sb.append("='");  
  86.             sb.append(attrNo);  
  87.             sb.append("'");  
  88.         }  
  89.   
  90.         if (null!=enterprise && 0 != enterprise) {  
  91.             sb.append(MyHibernateConfigurationHelper.buildSql(sb.toString()," AND "));  
  92.   
  93.             sb.append(" enterprise=");  
  94.             sb.append(enterprise);  
  95.         }  
  96.   
  97.         String countSql = sb.toString();// 总记录数sql  
  98.   
  99.         if (null != ascProperty) {  
  100.             sb.append(" ORDER BY ");  
  101.             sb.append(ascProperty);  
  102.             if (isAsc) {  
  103.                 sb.append(" ASC ");  
  104.             } else {  
  105.                 sb.append(" DESC ");  
  106.             }  
  107.         }  
  108.         if (0 != limit) {  
  109.             sb.append(" LIMIT ");  
  110.             sb.append(start);  
  111.             sb.append(",");  
  112.             sb.append(limit);  
  113.         }  
  114.   
  115.         int myRefreshPeriod = 600// 秒/10分钟  
  116.         String key = getKey(sb.toString());  
  117.   
  118.         try {  
  119.             p = (Pager<T>) admin.getFromCache(key, myRefreshPeriod);  
  120.             logger.info("本次从 OSCache 中读取数据...........");  
  121.         } catch (NeedsRefreshException e) {  
  122.             Query q = getSession().createSQLQuery(sb.toString())  
  123.                     .setResultTransformer(Transformers.ALIAS_TO_ENTITY_MAP);  
  124.             p.setEntityList(q.list());  
  125.             p.setTotalCounts(getEntityCount(countSql));// 总记录数  
  126.             admin.putInCache(key, p);// 往内存中填值  
  127.             logger.info("本次从 DataBase 中读取数据.................");  
  128.         }  
  129.         sb.delete(0, sb.length());  
  130.   
  131.         return p;  
  132.     }  


数据库网上找找,有 

没有到群29521319下

源码也可以到此群下