加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

基于ajax+struts实现的二级联动

发布时间:2020-12-16 00:28:51 所属栏目:百科 来源:网络整理
导读:周末闲来无事,就自己动手写了一个二级联动,主要使用了ajax,后台用struts作为控制器;有了二级联动之后,三级四级自然不在话下。废话少说,直接上源码。源码有点大,放在http://down.51cto.com/data/1470569。,完全免费。。。。 前台页面main.jsp: main.j

周末闲来无事,就自己动手写了一个二级联动,主要使用了ajax,后台用struts作为控制器;有了二级联动之后,三级四级自然不在话下。废话少说,直接上源码。源码有点大,放在http://down.51cto.com/data/1470569。,完全免费。。。。

前台页面main.jsp:

main.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme() + "://"

+ request.getServerName() + ":" + request.getServerPort()

+ path + "/";

%>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<base href="<%=basePath%>">


<title>json+struts菜单联动</title>


<meta http-equiv="pragma" content="no-cache">

<meta http-equiv="cache-control" content="no-cache">

<meta http-equiv="expires" content="0">

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

<meta http-equiv="description" content="This is my page">

<script src="jquery-1.10.2.js"></script>

<script type="text/javascript">

$(document).ready(function(){

var bookfirst=$("#selectcountry");

var booksecond=$("#selectcity");

$("#selectcountry").change(function (){ //一级select变动时,出发ajax请求

$("#selectcity option").remove();//清空,二级select的option

$.ajax({

url: "getcity.action",

dataType : "JSON",165);white-space:pre;"> type: "GET",165);white-space:pre;"> data:{'city.cityname':$(this).val()},165);white-space:pre;"> success: function(data){//请求成果,回调返回json字符串

var citylist=eval(data);

console.log(citylist);

$("#selectcity").append("<option></option>");

$("#selectcity option")[0].text=" 请选择城市";

for(i=0;i<=citylist.length-1;i++){

var j=i+1;

$("#selectcity").append("<option></option>");

$("#selectcity option")[j].text=citylist[i].cityname;

}

}


});

});

</script>

</head>


<body>

<center>

<select id="selectcountry" style="width:200px;">

<option>

请选择国家

</option>

德国

加拿大

法国

日本

俄罗斯

</option>

</select>

<select id="selectcity" style="width:200px;margin-left: 50px;">

请选择城市

</select>



</center>

</body>

</html>

struts配置文件,struts.xml

<?xml version="1.0" encoding="UTF-8" ?>


<!DOCTYPE struts PUBLIC

"-//Apache Software Foundation//DTD Struts Configuration 2.1//EN"

"http://struts.apache.org/dtds/struts-2.1.dtd">


<struts>

<constant name="struts.devMode" value="true"></constant>

<constant name="struts.custom.i18n.resources" value="city"></constant>

<constant name="struts.i18n.encoding" value="UTF-8"></constant>

<package name="json" extends="json-default">

<action name="getcity" class="com.jxj.action.CityAction" method="getcity">

<result name="SUCCESS" type="json">

<param name="root">citylist</param>

</result>

</action>

</package>

</struts>

处理请求的action:CityAction.java

package com.jxj.action;


import java.util.ArrayList;


import com.jxj.model.City;

import com.jxj.service.CityService;

import com.opensymphony.xwork2.ActionSupport;


public class CityAction extends ActionSupport {

ArrayList<City> citylist;

City city=new City();

public City getCity() {

return city;

}

public void setCity(City city) {

this.city = city;

public ArrayList<City> getCitylist() {

return citylist;

public void setCitylist(ArrayList<City> citylist) {

this.citylist = citylist;

CityService cityservice=new CityService();

public String getcity(){

System.out.println("hhhe");

String parentname=city.getCityname();

System.out.println("parentname:"+parentname);

citylist=new ArrayList<City>();

citylist= cityservice.getcity(parentname);

System.out.println(citylist.size());

return "SUCCESS";

}


实体City.java

package com.jxj.model;


public class City {

public int id;

public String cityname;

public String parentname;

public int getId() {

return id;

public void setId(int id) {

this.id = id;

public String getCityname() {

return cityname;

public void setCityname(String cityname) {

this.cityname = cityname;

public String getParentname() {

return parentname;

public void setParentname(String parentname) {

this.parentname = parentname;

service层CityService.java

package com.jxj.service;


import com.jxj.dao.CityDao;

import com.jxj.daoImpl.CityDaoImpl;

import com.jxj.model.City;


public class CityService {

CityDao citydao=new CityDaoImpl();

public ArrayList<City> getcity(String parentname) {

return citydao.getcity(parentname);

}


DAO层CityDao.java

package com.jxj.dao;


public interface CityDao {


ArrayList<City> getcity(String parentname);


DAO实现层CityDaoImpl.java

package com.jxj.daoImpl;

import java.sql.Connection;

import java.sql.ResultSet;

import java.sql.SQLException;

import java.sql.Statement;

import java.util.ArrayList;

import com.jxj.util.DB;


public class CityDaoImpl implements CityDao {

Connection conn=null;

Statement stmt=null;

ResultSet rs=null;

ArrayList<City> citylist=new ArrayList<City>();

String sql="select distinct cityname from city where parentname='"+parentname+"'";

System.out.println(sql);

conn=DB.getConn();

stmt=DB.getStatement(conn);

rs=DB.getResultSet(stmt,sql);

try {

while(rs.next()){

//city.setId(rs.getInt("id"));

city.setCityname(rs.getString("cityname"));

citylist.add(city);

} catch (SQLException e) {

e.printStackTrace();

自己封装的JDBC连接工具类:DB.java

package com.jxj.util;

import java.sql.*;


public class DB {

public static Connection getConn() {

Connection conn = null;

Class.forName("com.mysql.jdbc.Driver");

conn = DriverManager.getConnection("jdbc:mysql://localhost/demo?user=root&password=root");

} catch (ClassNotFoundException e) {

}

return conn;

public static PreparedStatement prepare(Connection conn,String sql) {

PreparedStatement pstmt = null;

if(conn != null) {

pstmt = conn.prepareStatement(sql);

return pstmt;

pstmt = conn.prepareStatement(sql,autoGenereatedKeys);

public static Statement getStatement(Connection conn) {

Statement stmt = null;

stmt = conn.createStatement();

return stmt;

public static ResultSet getResultSet(Statement stmt,255);">ResultSet rs = null;

if(stmt != null) {

rs = stmt.executeQuery(sql);

return rs;

public static void executeUpdate(Statement stmt,255);">stmt.executeUpdate(sql);

public static void close(Connection conn) {

conn.close();

conn = null;

public static void close(Statement stmt) {

stmt.close();

stmt = null;

public static void close(ResultSet rs) {

if(rs != null) {

rs.close();

rs = null;

}


数据表结构

wKioL1PCSQ7CkYfcAAO3n-AuTRM208.jpg

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读