Red de conocimiento de divisas - Consulta hotelera - Vínculo Ajax de provincia y ciudad de varios niveles (en struts2), ¿alguien puede hacer uno simple?

Vínculo Ajax de provincia y ciudad de varios niveles (en struts2), ¿alguien puede hacer uno simple?

Primero, la implementación de la idea

1. Hay dos formas de obtener el valor de la lista de provincias: una es devolver el conjunto de listas e iterar en la página, la otra es encapsular la lista desplegable; en una clase de negocios y use JQuery en la escritura del método de la página.

Aquí se adopta temporalmente el segundo método.

2. JQuery front-end: ① Todos los valores que deben almacenarse en la base de datos son posibles, elija uno de los tres (para determinar si se seleccionan los siguientes elementos en cascada, se selecciona el elemento más bajo). prevalecerá);

② Establezca los atributos de nombre de los tres cuadros desplegables como variables para facilitar la configuración dinámica ③ Al modificar la reubicación, dado que solo hay un código de área en la base de datos, el área debe ser; posicionarse según el código de área.

Método de posicionamiento: al juzgar los ceros después del número de región, si los últimos cuatro ceros son provincias y los dos ceros son ciudades, todos son distritos y condados.

3. Método de llamada: ① Haga referencia a include/js/cascade city.js en la página ① jsp (2) Llame al método de opción provincia (tipo de operación, número de provincia, número de ciudad, código de área); la lista de provincias

(3) Modifique la clase de entidad (la clase de entidad que se va a modificar), agregue la cadena privada provinciaNum cadena privada cityNum cadena privada condadoNum

y el get y correspondiente. método set (las variables en las clases de entidad se pueden personalizar). Estas tres variables se utilizan principalmente para localizar la zona urbana seleccionada por el usuario al modificar.

Segundo, implementación

1.cascadeCity.js

/*

*Subtipo-tipo de operación

* pNum-número de provincia

* número de ciudad-número de ciudad

* número de condado-número de región

*

*/

Función provinciaOpción(subtipo, pNum, ciudadNum, condadoNum) {

$.ajax({

Tipo: "Publicar",

URL : "jsonCityAction!provincesInfo.action",

Tipo de datos: "texto",

Éxito: función (json) {

var obj = $.parse JSON(JSON);

$("#province").html('<option value=""selected>\u8BF7\u9009\u62E9</option> '+obj . GS _ Resultado <); /p>

if(subType == "modify") {

//Cuadro desplegable para localizar provincias

$(' # opción de provincia[valor = '+ pNum+']'). attr('seleccionado', 'seleccionado');

}

getCity(subtipo, pNum, cityNum, num condado);

},

Error: función (json) {

alert(" JSON = "+JSON);

Devuelve falso

}

});

}

//Se activa cuando cambia la provincia

Función changeProvince() {

//Cuando la identificación de la operación es el cuadro desplegable de la provincia, se activa el evento.

$("#Provincia"). cambiar(función() {

var provincia _ valor = $(" seleccionar[id = 'provincia'][@ seleccionado]").

val();

getCity(operateType, provincia_valor);

});

}

Función getparmscity(){

var provincia _ valor = $(" select[id = ' provincia '][@ seleccionado]"). val();

getCity(operateType, provincia_value);

}

//Se activa cuando cambia la ciudad

Función changeCity ( ) {

//Cuando se opera el cuadro desplegable con el id de ciudad, se activa el evento.

$("#ciudad "). cambiar(función() {

var ciudad _ valor = $(" select[id = ' ciudad '][@ seleccionado]").val();

getCounty(operateType , city_value);

});

}

//Devuelve la lista de ciudades

Función getCity(subType, pNum, cityNum , numCondado) {

$.ajax({

Tipo: "Publicar",

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

Tipo de datos: "texto",

Éxito: function(json){

var obj = $.parse JSON(JSON);

p>

$("#ciudad ").html('<option value="" seleccionado>\u8BF7\u9009\u62E9</option>'+obj.GS_Result);

if( subType == "modificar") {

//Ubicar ciudad

$(' # opción de ciudad[valor = " '+núm de ciudad+' " ]'). ', verdadero);

}

getCounty(subtipo, número de ciudad, número de condado);

},

p>

Error: función (json){

alert(" JSON = "+JSON);

Devuelve falso

}

});

}

//Volver a la lista de distritos y condados.

Función getCounty(subtipo, cityNum, CountyNum) {

$.ajax({

Tipo: "Publicar",

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

Tipo de datos: "texto",

Éxito: función(json){

var obj = $.parseJSON(JSON);

$("#condado").

html('<option value="" seleccionado>\u8BF7\u9009\u62E9</option>'+obj.GS_Result);

if(subType == "modificar ") {

//Ubicar distritos y condados

$(' # opción de condado[valor = " '+núm de condado+' "]'). attr('selected ', true);

}

},

Error: función (json){

alert(" JSON = "+JSON);

Devuelve falso

}

});

}

2 Página .jsp:

......

Introducción a js

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

& ltscript type = " text/JavaScript " src = " include/js/cascadecity.js " ></ script & gt;

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

$(function() {

/* * * = = cascada Uso de la ciudad = = = * */

cambiar empresa();

cambiar provincia(); //Evento cuando cambia la opción de provincia

cambiar ciudad. (); //Evento de activación al cambiar las opciones de la ciudad.

});

& lt/script & gt;

…………

& lttr & gt

& ltTD altura = " 22 " clase = topline align = " derecha " >Región:

& ltselect tamaño = ' 1 ' nombre = " nombre de provincia " id = ' provincia ' clase = " sel " >& lt/select & gt;& lt/div & gt;

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

& ltselect tamaño = ' 1 ' id = ' ciudad ' class = " sel " >& lt/select & gt;

& lt/div & gt;

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

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

& lt/div & gt; p>

& 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/paquete & gt; p>

4. Clase de acción

Importar javax.annotation.resource;

Importar org.spring framework.stereotype.component;

Importar com. idea mov . servicio de ciudad .

Importar com open symphony . p> Clase pública CityAction extiende ActionSupport {

privado estático final largo serialVersionUID =-3234677100675620024 l;

CityService privado iCityService

Cadena privada gS _ PNum//Province número

Cadena privada gS _ CityNum//Número de ciudad

Cadena privada gS _ Resultado//Datos devueltos

La cadena pública provinciasInfo() arroja una excepción {

gS _ Resultado = servicio icity. obtener información de provincias();

Devolución exitosa

}

La cadena pública cityInfo( ) arroja un excepción {

gS _ Res

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

Devolución exitosa

}

La cadena pública countiesInfo() genera una excepción {

gS _ Resultado = servicio icity . getcountiesinfo(gS _ num ciudad);

Regreso exitoso

}

/***=== = =set, get=====***/

Cadena pública getgS_Result() {

Devolver gS _ Result

}

Cadena pública getgS_PNum() {

Devolver gS _ PNum

}

public void setgS _ PNum(String gSPNum){

gS _ PNum = gSPNum

}

Cadena pública getGS_CityNum() {

Devolver gS _ CityNum

}

conjunto de vacío públicoGS _ número de ciudad (número de ciudad de cadena){

gS _ Número de ciudad = número de ciudad

}

@RESOURCE

p>

public void setCityService(CityService servicio icity){

este servicio icity = servicio icity;

}

}

5. La capa empresarial y la capa dao colaboran para completar consultas de la base de datos.

/**

*

*Nombre del método: getProvincesInfo

*Descripción del método: obtiene el valor de la lista de provincias.

*Parámetro:@return

*Valor de retorno:

*Excepción:

*

*/

@Override

Cadena pública getProvincesInfo() {

búfer de cadena sb _ Provincias = nuevo búfer de cadena();

Lista & ltTcPublicProvinces & gttcPPList = itcppdao . buscar todo(tcpublic vincents . class, " orderNum ", verdadero, nuevos criterios[]{ restricciones . isnotnull(" num ")}

for(tcpubliccounties tcPP:tcPPList ) {

sb _ provincias . append(" & lt; valor de opción ='" + tcPP.getNum() + "'>+tcpp . gettitle()+" & lt;/option >" );

}

Devuelve sb _ vincents .

*Nombre del método: getCityInfo

*Descripción del método: obtiene la lista de ciudades por número de provincia.

*Parámetro: @ param pNum-número de provincia

*Parámetro: @return

*Valor de retorno:

*Excepción:

*

*/

@Override

Cadena pública getCityInfo(String pNum) {

búfer de cadena sb _ Ciudad = nuevo búfer de cadena();

Lista & ltTcPublicCity & gttcPCList = itpcdao . pNum)});

for(TcPublicCity tcPC:tcPCList){

sb _ city . append(" & lt; valor de opción = '" + tcPC.getNum() + " '>+tcpc . gettitle()+" & lt;/option >");

}

return sb _ tostring();

}

/**

*

*Nombre del método: getCountyInfo

*Descripción del método: según el número de ciudad, obtenga The valor de la lista de distrito y condado

*Parámetro:@param número de ciudad-número de ciudad

*Parámetro:@return

*Valor de retorno:

*Excepción:

*

*/

@Override

Cadena pública getCountiesInfo(String cityNum) {

búfer de cadena sb _ Condados = nuevo búfer de cadena();

Lista & ltTcPublicCounties & gttcPCsList = itcpcsdao . buscar todos(tcpublic condados . clase, "orderNum", verdadero, nuevos criterios[. ]{ restricciones . eq(" comentario ", número de ciudad)});

for(TcPublicCounties tcPCs:tcPCsList){

sb _ condados . ='" + tcPCs.getNum() + "'>+tcpcs . gettitle()+" </option>");

}

Devuelve sb_counties . ;

}

PD: Si tienes alguna pregunta, ¡deja a Coco y te agregaré! ~¡Te deseo buena suerte! ~

上篇: ¿Qué información se requiere para el registro de hotel en 2022? 下篇: ¿Qué placa de desarrollo ARM es la mejor? ¿Cómo elegir una placa de desarrollo?
Artículos populares