當前位置:法律諮詢服務網 - 中國稅務 - ajax 省市區多級聯動(在struts2中),有人能做出個簡單的嗎

ajax 省市區多級聯動(在struts2中),有人能做出個簡單的嗎

壹、實現思路

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!~

  • 上一篇:稅務登記證在哪裏辦?
  • 下一篇:稅務局失信懲戒現狀調查
  • copyright 2024法律諮詢服務網