extjs 省市区三级联动combobox
测试主文件JSP：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>省市区级联combobox测试</title> <jsp:include page="common-top.jsp" /> <mce:script type="text/javascript" src="script/ComboboxTest.js" mce_src="script/ComboboxTest.js"></mce:script> </head> <body style="padding:8px;" mce_style="padding:8px;"> </body> </html>
ComboboxTest.js
Ext.ns("com.gwtjs"); var resourceNo =1; com.gwtjs.ProvinceCombo = Ext.extend(Ext.form.ComboBox,{ oldId:"", lock:false, store:null, constructor:function(_cfg){ if(!_cfg) _cfg = {}; this.Model = Ext.data.Record.create([ "id", "provinceID", "name" ]); this.reader = new Ext.data.JsonReader({ root:"items" },this.Model); this.store = new Ext.data.Store({ reader:this.reader, proxy : new Ext.data.HttpProxy({ url : '../getProvinces.action' }) }); Ext.apply(this,_cfg); com.gwtjs.ProvinceCombo.superclass.constructor.call(this, { label:"省", id:this.oldId+"province", store:this.store, editable:!this.lock, listWidth : 160, name : "province", hiddenName : 'province', valueField : "id", displayField : "name", triggerAction : 'all', mode : 'remote', listeners: { 'select': function(combo, record, number) { console.warn("select",this); var o = this.ownerCt.ownerCt.ownerCt.cityCombo; Ext.apply(o.store.baseParams,{fatherID:record.get("provinceID")}); o.store.load(); console.dir(o.store.baseParams); }, 'blur':function(){ //console.warn("blur",this); } } }); } }); com.gwtjs.CityCombo = Ext.extend(Ext.form.ComboBox,{ oldId:"", lock:false, store:null, constructor:function(_cfg){ if(!_cfg) _cfg = {}; this.Model = Ext.data.Record.create([ "id", "name", "cityID", "fatherID" ]); this.reader = new Ext.data.JsonReader({ root:"items" },this.Model); this.store = new Ext.data.Store({ baseParams:{fatherID:null}, reader:this.reader, proxy : new Ext.data.HttpProxy({ url : '../getCitys.action' }) }); Ext.apply(this,_cfg); com.gwtjs.CityCombo.superclass.constructor.call(this, { id:this.oldId+"city", store:this.store, editable:this.lock, listWidth : 280, name : "name", hiddenName : 'name', valueField : "id", displayField : "name", triggerAction : 'all', mode : 'remote', listeners: { 'select': function(combo, record, number) { console.warn("select",this); var o = this.ownerCt.ownerCt.ownerCt.areaCombo; Ext.apply(o.store.baseParams,{fatherID:record.get("cityID")}); o.store.load(); console.dir(o.store.baseParams); }, 'blur':function(){ //console.warn("blur",this); } } }); } }); com.gwtjs.AreaCombo = Ext.extend(Ext.form.ComboBox,{ oldId:"", lock:false, store:null, constructor:function(_cfg){ if(!_cfg) _cfg = {}; this.Model = Ext.data.Record.create([ "id", "name", "areaID", "fatherID" ]); this.reader = new Ext.data.JsonReader({ root:"items" },this.Model); this.store = new Ext.data.Store({ baseParams:{fatherID:null}, reader:this.reader, proxy : new Ext.data.HttpProxy({ url : '../getAreas.action' }) }); Ext.apply(this,_cfg); com.gwtjs.AreaCombo.superclass.constructor.call(this, { id:this.oldId+"area", store:this.store, editable:this.lock, listWidth : 280, name : "area", hiddenName : 'area', valueField : "id", displayField : "name", triggerAction : 'all', mode : 'remote' }); } }); com.gwtjs.TouristRouteForm = Ext.extend(Ext.form.FormPanel,{ oldId:"", url : "../editorTouristRoute.action", plain:true,//baseCls:"x-plain", lock:false, provinceCombo:null, cityCombo:null, areaCombo:null, constructor:function(_cfg){ if(!_cfg) _cfg = {}; this.provinceCombo = new com.gwtjs.ProvinceCombo({ oldId:"P_", lock:false }); this.cityCombo = new com.gwtjs.CityCombo({ oldId:"C_", lock:false }); this.areaCombo = new com.gwtjs.AreaCombo({ oldId:"A_", lock:false }); Ext.apply(_cfg,{ title:"省市区级联combobox测试", labelAlign : 'right', labelWidth:62, border:false, frame : true, defaults : { layout:"column", border:false, anchor : "100%" }, items:[{ defaults:{ layout:"form", columnWidth:'.33' }, items:[{ items:this.provinceCombo },{ items:this.cityCombo },{ items:this.areaCombo }] }] }); Ext.apply(this,_cfg); com.gwtjs.TouristRouteForm.superclass.constructor.call(this, _cfg); } }); Ext.onReady(function(){ var layout = new com.gwtjs.TouristRouteForm(); layout.render(Ext.getBody()); });
JAVA Model
ComboArea.java
/* * To change this template, choose Tools | Templates * and open the template in the editor. */ package com.gwtjs.model; /** * <h2 style="color:#060;" mce_style="color:#060;">区域-县-地区县-区</h2> * * @hibernate.class table="t_combo_area" * @author Administrator * */ public class ComboArea { /** * @hibernate.id generator-class="native" */ private int id; /** * @hibernate.property */ private Integer areaID; /** * @hibernate.property type="java.lang.String" length="60" column="area" */ private String name; /** * @hibernate.property */ private Integer fatherID; public Integer getAreaID() { return areaID; } public void setAreaID(Integer areaID) { this.areaID = areaID; } public Integer getFatherID() { return fatherID; } public void setFatherID(Integer fatherID) { this.fatherID = fatherID; } public int getId() { return id; } public void setId(int id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } }
ComboCity.java
/* * To change this template, choose Tools | Templates * and open the template in the editor. */ package com.gwtjs.model; /** * <h2 style="color:#060;" mce_style="color:#060;">城市</h2> * * @hibernate.class table="t_combo_city" * @author Administrator * */ public class ComboCity { /** * @hibernate.id generator-class="native" */ private Integer id; /** * @hibernate.property */ private Integer cityID; /** * @hibernate.property type="java.lang.String" length="60" column="city" */ private String name; /** * @hibernate.property */ private Integer fatherID; public Integer getCityID() { return cityID; } public void setCityID(Integer cityID) { this.cityID = cityID; } public int getFatherID() { return fatherID; } public void setFatherID(int fatherID) { this.fatherID = fatherID; } public Integer getId() { return id; } public void setId(Integer id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } }
ComboProvince.java
/* * To change this template, choose Tools | Templates * and open the template in the editor. */ package com.gwtjs.model; /** * <h2 style="color:#060;" mce_style="color:#060;">省</h2> * * @hibernate.class table="t_combo_province" * @author Administrator */ public class ComboProvince { /** * @hibernate.id generator-class="native" */ private int id; /** * @hibernate.property */ private Integer provinceID; /** * @hibernate.property type="java.lang.String" length="60" column="province" */ private String name; public int getId() { return id; } public void setId(int id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } public Integer getProvinceID() { return provinceID; } public void setProvinceID(Integer provinceID) { this.provinceID = provinceID; } }
Struts
xml
<struts> <package name="com.gwtjs.area" extends="json-default" namespace="/management"> <action name="getProvinces" class="areaAction"> <result type="json" /> <result type="json" name="input" /> </action> <action name="getCitys" class="areaAction" method="findCitys"> <result type="json" /> <result type="json" name="input" /> </action> <action name="getAreas" class="areaAction" method="findAreas"> <result type="json" /> <result type="json" name="input" /> </action> </package> </struts>
Action
package com.gwtjs.struts.action; import java.util.ArrayList; import java.util.List; import javax.annotation.Resource; import org.springframework.context.annotation.Scope; import org.springframework.stereotype.Component; import org.springframework.stereotype.Controller; import com.gwtjs.service.AreaService; import com.gwtjs.struts.BaseAction; @Controller @Scope("prototype") @Component("areaAction") public class AreaAction extends BaseAction { private static final long serialVersionUID = 4983710651693497150L; public List<?> items = new ArrayList<Object>(); private Integer fatherID; @Resource private AreaService areaService; @Override public String execute() throws Exception { items = areaService.execute(ascProperty, isAsc); return SUCCESS; } public String findCitys() throws Exception { if (fatherID != null) { items = areaService.findCitys(fatherID); } return SUCCESS; } public String findAreas() throws Exception { if (fatherID != null) { items = areaService.findAreas(fatherID); } return SUCCESS; } public void setItems(List<Object> items) { this.items = items; } public void setFatherID(Integer fatherID) { this.fatherID = fatherID; } public Object getFatherID() { return fatherID; } public List<?> getItems() { return items; } }
Service
package com.gwtjs.service;
import java.util.List;
import com.gwtjs.model.ComboArea;
import com.gwtjs.model.ComboCity;
import com.gwtjs.model.ComboProvince;
public interface AreaService {
public List<ComboProvince> execute(final String ascProperty, final boolean isAsc) ;
public List<ComboCity> findCitys(Object fatherID);
public List<ComboArea> findAreas(Object fatherID);
}
package com.gwtjs.service.impl;
import java.util.List;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.gwtjs.dao.ComboAreaManager;
import com.gwtjs.dao.ComboCityManager;
import com.gwtjs.dao.ComboProvinceManager;
import com.gwtjs.model.ComboArea;
import com.gwtjs.model.ComboCity;
import com.gwtjs.model.ComboProvince;
import com.gwtjs.model.utils.Pager;
import com.gwtjs.service.AreaService;
@Service("areaService")
public class AreaServiceImpl implements AreaService {
@Autowired
private ComboProvinceManager provinceDao;
@Autowired
private ComboCityManager cityDao;
@Autowired
private ComboAreaManager areaDao;
@Override
public List<ComboProvince> execute(final String ascProperty, final boolean isAsc) {
Pager<ComboProvince> p = provinceDao.findAll(ComboProvince.class, ascProperty, isAsc);
return p.getEntityList();
}
@Override
public List<ComboCity> findCitys(Object fatherID) {
return cityDao.findPropertyAll(ComboCity.class, "fatherID", fatherID).getEntityList();
}
@Override
public List<ComboArea> findAreas(Object fatherID) {
return areaDao.findPropertyAll(ComboArea.class, "fatherID", fatherID).getEntityList();
}
}
Hibernate Dao
package com.gwtjs.dao;
import com.gwtjs.model.ComboProvince;
public interface ComboProvinceManager extends EntityDao<ComboProvince,Integer>{
}
package com.gwtjs.dao;
import com.gwtjs.model.ComboCity;
public interface ComboCityManager extends EntityDao<ComboCity, Integer> {
}
package com.gwtjs.dao;
public interface ComboAreaManager extends
EntityDao<com.gwtjs.model.ComboArea, Integer> {
}
上面的是三个Java类接口，拷贝到一起了，实现类为空的实现，只为了类型映射方便而已
EntityDao 接口
/** * <h2>按属性查全部，无分页，无排序 - 1</h2> * * @param entityClass * @param attrName * @param attrNo * @return */ public Pager<T> findPropertyAll(Class<T> entityClass, String attrName, Object attrNo); /** * <h2>按属性查全部 - 4</h2> * @param enterprise 企业标识 * @param entityClass * 实体 * @param attrName * 查询的属性名 * @param attrNo * 属性值 * @param start * @param limit * @param ascProperty * @param isAsc * @return */ public Pager<T> findPropertyAll(Class<T> entityClass, Integer enterprise, String attrName, Object attrNo, Integer start, Integer limit, String ascProperty, boolean isAsc);EntityDaoImpl实现类
/**
* <h2>按属性查全部 - 1</h2>
*
* @param entityClass
* 实体
* @param attrName
* 查询的属性名
* @param attrNo
* 属性值
* @return
*/
@Override
public Pager<T> findPropertyAll(Class<T> entityClass, String attrName,
Object attrNo) {
return findPropertyAll(entityClass, attrName, attrNo, null, true);
}
/**
* <h2>按属性查全部 - 2</h2>
*
* @param entityClass
* 实体
* @param attrName
* 查询的属性名
* @param attrNo
* 属性值
* @param ascProperty
* @param isAsc
* @return
*/
@Override
public Pager<T> findPropertyAll(Class<T> entityClass, String attrName,
Object attrNo, String ascProperty, boolean isAsc) {
return findPropertyAll(entityClass, attrName, attrNo, 0, 0,
ascProperty, isAsc);
}
/**
* <h2>按属性查全部 - 3</h2>
*
* @param entityClass
* 实体
* @param attrName
* 查询的属性名
* @param attrNo
* 属性值
* @param start
* @param limit
* @param ascProperty
* @param isAsc
* @return
*/
public Pager<T> findPropertyAll(final Class<T> entityClass,
final String attrName, final Object attrNo, final Integer start,
final Integer limit, final String ascProperty, final boolean isAsc) {
return findPropertyAll(entityClass, null, attrName, attrNo, start,
limit, ascProperty, isAsc);
}
@Override
/**
* <h2>按属性查全部 - 4</h2>
* @param entityClass 实体
* @param attrName 查询的属性名
* @param attrNo 属性值
* @param start
* @param limit
* @param ascProperty
* @param isAsc
* @return
*/
public Pager<T> findPropertyAll(final Class<T> entityClass,
final Integer enterprise, final String attrName,
final Object attrNo, final Integer start, final Integer limit,
final String ascProperty, final boolean isAsc) {
Pager<T> p = new Pager<T>();
StringBuilder sb = new StringBuilder();
sb.append("SELECT * FROM ");
sb.append(MyHibernateConfigurationHelper.getTableName(entityClass));
if (null != attrName && null != attrNo) {
sb.append(" WHERE ");
sb.append(attrName);
sb.append("='");
sb.append(attrNo);
sb.append("'");
}
if (null!=enterprise && 0 != enterprise) {
sb.append(MyHibernateConfigurationHelper.buildSql(sb.toString()," AND "));
sb.append(" enterprise=");
sb.append(enterprise);
}
String countSql = sb.toString();// 总记录数sql
if (null != ascProperty) {
sb.append(" ORDER BY ");
sb.append(ascProperty);
if (isAsc) {
sb.append(" ASC ");
} else {
sb.append(" DESC ");
}
}
if (0 != limit) {
sb.append(" LIMIT ");
sb.append(start);
sb.append(",");
sb.append(limit);
}
int myRefreshPeriod = 600; // 秒/10分钟
String key = getKey(sb.toString());
try {
p = (Pager<T>) admin.getFromCache(key, myRefreshPeriod);
logger.info("本次从 OSCache 中读取数据...........");
} catch (NeedsRefreshException e) {
Query q = getSession().createSQLQuery(sb.toString())
.setResultTransformer(Transformers.ALIAS_TO_ENTITY_MAP);
p.setEntityList(q.list());
p.setTotalCounts(getEntityCount(countSql));// 总记录数
admin.putInCache(key, p);// 往内存中填值
logger.info("本次从 DataBase 中读取数据.................");
}
sb.delete(0, sb.length());
return p;
}
数据库网上找找，有
没有到群29521319下
源码也可以到此群下