1.獲取省份的列表值,有2種方式:壹是返回List集合,在頁面進行叠代;二是在業務類中將下拉列表封裝好,頁面通過JQuery方法寫入。
這裏暫時采用第二種方法。
2.前臺JQuery:①數據庫裏面需要存的值,三者都有可能,三選壹(判斷是否選中了下面的級聯項,按選中的最低級項為準值);
②將三個下拉框的name屬性設置為變量,便於動態設置;③當修改重定位時,因為數據庫中只有壹個地區編號,所以需要根據地區編號將所在地區給定位。
定位方法:通過判斷所在地區的編號後面的零,如果是四個0結束即為省,二個0即為市,都符合為區縣。
3.調用方法:①jsp頁面上引用include/js/cascadeCity.js;②調用返回省列表的方法provinceOption(操作類型, 省份編號, 城市編號, 區縣編號);
③修改實體類(該實體類即妳要修改的那個實體類),在實體類中添加private String provinceNum;private String cityNum;private String countyNum;
及對應的get、set方法(添加實體類中變量可自定義),添加的這3個變量主要用於修改時定位用戶已選城市地區。
二、實現
1.cascadeCity.js
/*
* subType - 操作類型
* pNum - 省份編號
* cityNum - 城市編號
* countyNum - 區縣編號
*
*/
function provinceOption(subType, pNum, cityNum, countyNum) {
$.ajax({
type: "POST",
url: "jsonCityAction!provincesInfo.action",
dataType:"text",
success: function(json){
var obj = $.parseJSON(json);
$("#province").html('<option value="" selected>\u8BF7\u9009\u62E9</option>' + obj.gS_Result);
if(subType == "modify") {
//給省份進行下拉框定位
$('#province option[value=' + pNum + ']').attr('selected', 'selected');
}
getCity(subType, pNum, cityNum, countyNum);
},
error: function(json){
alert("json=" + json);
return false;
}
});
}
//改變省份時觸發
function changeProvince() {
//當操作id為province的下拉框時,觸發事件
$("#province").change(function() {
var province_value = $("select[id='province'][@selected]").val();
getCity(operateType, province_value);
});
}
function getparmscity(){
var province_value = $("select[id='province'][@selected]").val();
getCity(operateType, province_value);
}
//改變城市時觸發
function changeCity() {
//當操作id為city的下拉框時,觸發事件
$("#city").change(function() {
var city_value = $("select[id='city'][@selected]").val();
getCounty(operateType, city_value);
});
}
//返回城市列表
function getCity(subType, pNum, cityNum, countyNum) {
$.ajax({
type: "POST",
url: "jsonCityAction!cityInfo.action?gS_PNum=" + pNum,
dataType:"text",
success: function(json){
var obj = $.parseJSON(json);
$("#city").html('<option value="" selected>\u8BF7\u9009\u62E9</option>' + obj.gS_Result);
if(subType == "modify") {
//給城市定位
$('#city option[value="' + cityNum + '"]').attr('selected',true);
}
getCounty(subType, cityNum, countyNum);
},
error: function(json){
alert("json=" + json);
return false;
}
});
}
//返回區縣列表
function getCounty(subType, cityNum, countyNum) {
$.ajax({
type: "POST",
url: "jsonCityAction!countiesInfo.action?gS_CityNum=" + cityNum,
dataType:"text",
success: function(json){
var obj = $.parseJSON(json);
$("#county").html('<option value="" selected>\u8BF7\u9009\u62E9</option>' + obj.gS_Result);
if(subType == "modify") {
//給區縣定位
$('#county option[value="' + countyNum + '"]').attr('selected',true);
}
},
error: function(json){
alert("json=" + json);
return false;
}
});
}
2.jsp頁面:
……
引入js
<script src="include/js/jquery-1.4.2.min.js" type="text/javascript"></script>
<script type="text/javascript" src="include/js/cascadeCity.js"></script>
<script type="text/javascript">
$(function() {
/***===級聯城市使用===***/
changetrcompany();
changeProvince(); //改變省份選項時觸發事件
changeCity(); //改變城市選項時觸發事件
});
</script>
…………
<tr>
<td height="22" class=topline align="right">所屬地區:</td>
<td bgcolor="#FFFFFF" height="22">
<div>
<div id="provinceDiv" class="divBL">
<select size='1' name="provinceName" id='province' class="sel"> </select></div>
<div id="cityDiv" class="divBL">
<select size='1' id='city' class="sel"> </select>
</div>
<div id="countyDiv" class="divBL">
<select size='1' id='county' class="sel"></select>
</div>
</div>
</td>
</tr>
3.struts.xml
<package name="ajaxSYS" extends="json-default" >
<action name="jsonCityAction" class="iCityAction">
<result type="json"/>
</package>
</action>
4.action類
import javax.annotation.Resource;
import org.springframework.stereotype.Component;
import com.ideamov.service.city.CityService;
import com.opensymphony.xwork2.ActionSupport;
@Component(value = "iCityAction")
public class CityAction extends ActionSupport {
private static final long serialVersionUID = -3234677100675620024L;
private CityService iCityService;
private String gS_PNum; //省份編號
private String gS_CityNum; //城市編號
private String gS_Result; //返回數據
public String provincesInfo() throws Exception {
gS_Result = iCityService.getProvincesInfo();
return SUCCESS;
}
public String cityInfo() throws Exception {
gS_Result = iCityService.getCityInfo(gS_PNum);
return SUCCESS;
}
public String countiesInfo() throws Exception {
gS_Result = iCityService.getCountiesInfo(gS_CityNum);
return SUCCESS;
}
/***=====set、get=====***/
public String getgS_Result() {
return gS_Result;
}
public String getgS_PNum() {
return gS_PNum;
}
public void setgS_PNum(String gSPNum) {
gS_PNum = gSPNum;
}
public String getGS_CityNum() {
return gS_CityNum;
}
public void setGS_CityNum(String cityNum) {
gS_CityNum = cityNum;
}
@Resource
public void setCityService(CityService iCityService) {
this.iCityService = iCityService;
}
}
5.業務層和dao層就是配合來完成數據庫查詢
/**
*
* 方法名: getProvincesInfo
* 方法描述: 獲取省份的列表值
* 參數: @return
* 返回值:
* 異常:
*
*/
@Override
public String getProvincesInfo() {
StringBuffer sb_Provinces = new StringBuffer();
List<TcPublicProvinces> tcPPList = iTcPPDao.findAll(TcPublicProvinces.class, "orderNum", true, new Criterion[]{Restrictions.isNotNull("num")});
for(TcPublicProvinces tcPP : tcPPList) {
sb_Provinces.append("<option value='" + tcPP.getNum() + "'>" + tcPP.getTitle() + "</option>");
}
return sb_Provinces.toString();
}
/**
*
* 方法名: getCityInfo
* 方法描述: 通過省份編號,獲取到城市列表
* 參數: @param pNum - 省份編號
* 參數: @return
* 返回值:
* 異常:
*
*/
@Override
public String getCityInfo(String pNum) {
StringBuffer sb_City = new StringBuffer();
List<TcPublicCity> tcPCList = iTcPCDao.findAll(TcPublicCity.class, "orderNum", true, new Criterion[]{Restrictions.eq("remark", pNum)});
for(TcPublicCity tcPC : tcPCList) {
sb_City.append("<option value='" + tcPC.getNum() + "'>" + tcPC.getTitle() + "</option>");
}
return sb_City.toString();
}
/**
*
* 方法名: getCountyInfo
* 方法描述: 根據城市編號,獲取到區縣列表的值
* 參數: @param cityNum - 城市編號
* 參數: @return
* 返回值:
* 異常:
*
*/
@Override
public String getCountiesInfo(String cityNum) {
StringBuffer sb_Countys = new StringBuffer();
List<TcPublicCounties> tcPCsList = iTcPCsDao.findAll(TcPublicCounties.class, "orderNum", true, new Criterion[]{Restrictions.eq("remark", cityNum)});
for(TcPublicCounties tcPCs : tcPCsList) {
sb_Countys.append("<option value='" + tcPCs.getNum() + "'>" + tcPCs.getTitle() + "</option>");
}
return sb_Countys.toString();
}
PS:有問題可留蔻蔻,我加妳!~good luck!~