當前位置:編程學習大全網 - 源碼下載 - Ajax多級省市聯動(在struts2中),有人能做個簡單的嗎?

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

第壹,思想的實現

1.獲取省份列表值有兩種方式:壹種是返回列表集,在頁面上叠代;二是將下拉列表封裝在業務類中,頁面用JQuery方法編寫。

這裏暫時采用第二種方法。

2.前臺jQuery: ①需要存儲在數據庫中的值都是可能的,三者選其壹(判斷是否選擇了以下級聯項,以選擇的最低項為準);

②將三個下拉框的名稱屬性設置為變量,方便動態設置;③修改重定位時,由於數據庫中只有壹個區號,所以需要根據區號定位區域。

定位方法:通過判斷地區序號後面的零,如果四個零最後是省,兩個零是市,都是區縣。

3.調用方法:①在①jsp頁面引用include/js/cascade city . js;(2)調用返回省份列表的provinceOption(操作類型、省份號、城市號、地區號)方法;

(3)修改實體類(要修改的實體類),在實體類中添加私有字符串provinceNum私有字符串cityNum私有字符串countyNum

以及相應的get和set方法(實體類中的變量可以自定義)。這三個變量主要用於定位用戶在修改時選擇的城市區域。

第二,實現

1.cascadeCity.js

/*

*子類型-操作類型

* pNum-省份編號

* city num-城市號碼

* county num-地區號碼

*

*/

函數provinceOption(子類型,pNum,cityNum,countyNum) {

$.ajax({

類型:“帖子”,

URL:“jsonCityAction!provincesInfo.action”,

數據類型:“文本”,

成功:函數(json){

var obj = $。parse JSON(JSON);

$(" #省")。html(' & lt;選項值= " " selected & gt\ u8BF7 \ u9009 \ u62E9 & lt/option & gt;'+obj . GS _ Result);

if(subType == "modify") {

//用於定位省份的下拉框。

$(' # province option[value = '+pNum+']')。attr('selected ',' selected ');

}

getCity(子類型,pNum,cityNum,county num);

},

錯誤:函數(json){

alert(" JSON = "+JSON);

返回false

}

});

}

//省份變更時觸發

函數changeProvince() {

//當操作id為省份的下拉框時,觸發事件。

$(" #省")。change(function() {

var province _ value = $(" select[id = ' province '][@ selected]")。val();

getCity(operateType,province _ value);

});

}

函數getparmscity(){

var province _ value = $(" select[id = ' province '][@ selected]")。val();

getCity(operateType,province _ value);

}

//城市變化時觸發

函數changeCity() {

//當操作id為city的下拉框時,觸發事件。

$("#city ")。change(function() {

var city _ value = $(" select[id = ' city '][@ selected]")。val();

getCounty(operateType,city _ value);

});

}

//返回城市列表

函數getCity(subType,pNum,cityNum,countyNum) {

$.ajax({

類型:“帖子”,

URL:“jsonCityAction!cityInfo.action?gS_PNum=" + pNum,

數據類型:“文本”,

成功:函數(json){

var obj = $。parse JSON(JSON);

$("#city ")。html(' & lt;選項值= " " selected & gt\ u8BF7 \ u9009 \ u62E9 & lt/option & gt;'+obj . GS _ Result);

if(subType == "modify") {

//定位城市

$(' # city option[value = " '+city num+' "]')。attr('selected ',true);

}

getCounty(子類型,cityNum,county num);

},

錯誤:函數(json){

alert(" JSON = "+JSON);

返回false

}

});

}

//返回區縣列表。

函數getCounty(子類型,cityNum,countyNum) {

$.ajax({

類型:“帖子”,

URL:“jsonCityAction!countiesInfo.action?gS_CityNum=" + cityNum,

數據類型:“文本”,

成功:函數(json){

var obj = $。parse JSON(JSON);

$("#county ")。html(' & lt;選項值= " " selected & gt\ u8BF7 \ u9009 \ u62E9 & lt/option & gt;'+obj . GS _ Result);

if(subType == "modify") {

//定位區縣

$(' # county option[value = " '+county num+' "]')。attr('selected ',true);

}

},

錯誤:函數(json){

alert(" JSON = "+JSON);

返回false

}

});

}

2.jsp頁面:

……

介紹js

& ltscript src = " include/js/jquery-1 . 4 . 2 . min . js " type = " text/JavaScript " & gt;& lt/script & gt;

& ltscript type = " text/JavaScript " src = " include/js/cascade city . js " >& lt/script & gt;

& ltscript type = " text/JavaScript " & gt;

$(function() {

/* * * = =級聯城市使用= = = * */

changetr company();

change province();//省選項改變時事件。

change city();//在更改城市選項時觸發事件。

});

& lt/script & gt;

…………

& lttr & gt

& ltTD height = " 22 " class = topline align = " right " >地區:

& ltTD bgcolor = " # FFFFFF " height = " 22 " & gt。

& ltdiv & gt

& ltdiv id = " province div " class = " div bl " >

& ltselect size = ' 1 ' name = " province name " id = ' province ' class = " sel " >& lt/select & gt;& lt/div & gt;

& ltdiv id="cityDiv" class="divBL " >

& ltselect size = ' 1 ' id = ' city ' class = " sel " >& lt/select & gt;

& lt/div & gt;

& ltdiv id="countyDiv" class="divBL " >

& ltselect size = ' 1 ' id = ' county ' class = " sel " >& lt/select & gt;

& lt/div & gt;

& lt/div & gt;

& lt/TD & gt;

& lt/tr & gt;

3.struts.xml

& ltpackage name = " Ajax sys " extends = " JSON-default " & gt;

& ltaction name = " jsonCityAction " class = " icity action " & gt;

& ltresult type = " JSON "/& gt;

& lt/package & gt;

& lt/action & gt;

4 .行動類

導入javax . annotation . resource;

導入org . spring framework . stereotype . component;

導入com . idea mov . service . city . city service;

導入com . open symphony . xwork 2 . action support;

@Component(value = "iCityAction ")

公共類CityAction擴展ActionSupport {

private static final long serialVersionUID =-3234677100675620024 l;

私人CityService iCityService

私有字符串gS _ PNum//省號

私有字符串gS _ CityNum//城市號碼

私有字符串gS _ Result//返回數據

公共字符串provincesInfo()引發異常{

gS _ Result = icity service . get provinces info();

返回成功;

}

公共字符串cityInfo()引發異常{

gS _ Result = icity service . getcityinfo(gS _ PNum);

返回成功;

}

公共字符串countiesInfo()引發異常{

gS _ Result = icity service . getcountiesinfo(gS _ city num);

返回成功;

}

/***=====set、get=====***/

公共字符串getgS_Result() {

返回gS _ Result

}

公共字符串getgS_PNum() {

返回gS _ PNum

}

public void setgS _ PNum(String gSPNum){

gS _ PNum = gSPNum

}

公共字符串getGS_CityNum() {

返回gS _ CityNum

}

public void setGS _ city num(String city num){

gS _ CityNum = cityNum

}

@資源

public void setCityService(CityService icity service){

this . icity service = icity service;

}

}

5.業務層和dao層協作完成數據庫查詢。

/**

*

*方法名:getProvincesInfo

*方法描述:獲取省份列表值。

*參數:@return

*返回值:

*異常:

*

*/

@覆蓋

公共字符串getProvincesInfo() {

string buffer sb _ Provinces = new string buffer();

列表& ltTcPublicProvinces & gttcPPList = itcppdao . find all(tcpublic vincents . class," orderNum ",true,new criteria[]{ restrictions . isnotnull(" num ")});

for(tcpubliccounties tcPP:tcPPList){

sb _ provinces . append(" & lt;選項值='" + tcPP.getNum() + "'>+tcpp . gettitle()+" & lt;/option >;");

}

返回sb _ vincents . tostring();

}

/**

*

*方法名:getCityInfo

*方法描述:通過省號獲取城市列表。

*參數:@ param pNum-省份編號

*參數:@return

*返回值:

*異常:

*

*/

@覆蓋

公共字符串getCityInfo(字符串pNum) {

string buffer sb _ City = new string buffer();

列表& ltTcPublicCity & gttcPCList = itpcdao . find all(tcpubliccity . class," orderNum ",true,new criteria[]{ restrictions . eq(" remark ",pNum)});

for(TcPublicCity tcPC:tcPCList){

sb _ city . append(" & lt;選項值='" + tcPC.getNum() + "'>+tcpc . gettitle()+" & lt;/option >;");

}

return sb _ city . tostring();

}

/**

*

*方法名:getCountyInfo

*方法描述:根據城市編號,得到區縣列表的值。

*參數:@ param city num-城市號

*參數:@return

*返回值:

*異常:

*

*/

@覆蓋

公共字符串getCountiesInfo(字符串cityNum) {

string buffer sb _ Countys = new string buffer();

列表& ltTcPublicCounties & gttcPCsList = itcpcsdao . find all(tcpublic counties . class," orderNum ",true,new criteria[]{ restrictions . eq(" remark ",city num)});

for(TcPublicCounties tcPCs:tcPCsList){

sb _ countys . append(" & lt;選項值='" + tcPCs.getNum() + "'>+tcpcs . gettitle()+" & lt;/option >;");

}

返回sb _ countys . tostring();

}

PS:有問題可以離開Coco,我會加妳的!~祝妳好運!~

  • 上一篇:php接口是什麽
  • 下一篇:查找“基於MATLAB的擴頻通信抗幹擾仿真研究”相關資料
  • copyright 2024編程學習大全網