项目部署为:
数据库SQL代码为:
--省级 provincial
create table provincial (
provincialID int,
provincialName varchar(50),
primary key (provincialID)
)engine=INNODB default charset=gb2312;
--城市 city
create table city (
cityID int not null,
cityName varchar(50) not null,
provincialID int not null,
primary key (cityID)
)engine=INNODB default charset=gb2312;
详细数据库代码如下链接:
http://download.csdn.net/detail/aigochina/4649480
下面的代码用于与数据库实现映射:
City.java类代码:(城市)
public class City {
private int cityID;
public int getCityID() {
return cityID;
}
public void setCityID(int cityID) {
this.cityID = cityID;
}
public String getCityName() {
return cityName;
}
public void setCityName(String cityName) {
this.cityName = cityName;
}
public int getProvincialID() {
return provincialID;
}
public void setProvincialID(int provincialID) {
this.provincialID = provincialID;
}
private String cityName;
private int provincialID;
}
Province.java类代码:(省)
public class Province {
private int provincialID;
public int getProvincialID() {
return provincialID;
}
public void setProvincialID(int provincialID) {
this.provincialID = provincialID;
}
public String getProvincialName() {
return provincialName;
}
public void setProvincialName(String provincialName) {
this.provincialName = provincialName;
}
private String provincialName;
}
CityDao.java类代码:(实现与数据库操作)
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;
public class CityDao {
Connection conn=null;
PreparedStatement pre=null;
ResultSet res;
//根据省份ID来获得相对应的城市信息
public List<City> getCity(int provincialID){
List<City> cityList=new ArrayList<City>();
String sql="SELECT * FROM city WHERE provincialID=?";
conn=new Basedao().getConnection();
try {
pre=conn.prepareStatement(sql);
pre.setInt(1,provincialID);
res=pre.executeQuery();
while(res.next()){
City city=new City();
city.setCityID(res.getInt("cityID"));
city.setCityName(res.getString("cityName"));
city.setProvincialID(res.getInt("provincialID"));
cityList.add(city);
}
} catch (SQLException e) {
e.printStackTrace();
}
return cityList;
}
//获得所有的省份列表
public List<Province> getProvince(){
List<Province> proList=new ArrayList<Province>();
String sql="SELECT * FROM provincial";
conn=new ConnectDB().getConnection();
try {
pre=conn.prepareStatement(sql);
res=pre.executeQuery();
while(res.next()){
Province pro=new Province();
pro.setProvincialID(res.getInt("provincialID"));
pro.setProvincialName(res.getString("provincialName"));
proList.add(pro);
}
} catch (SQLException e) {
e.printStackTrace();
}
return proList;
}
}
ConnectDB.java代码(用于实现数据库连接)
public class ConnectDB {
public Connection conn=null;
private String url="jdbc:mysql://localhost:3306/test";
private String user="root";
private String password="lovemu";
public Connection getConnection(){
try {
Class.forName("com.mysql.jdbc.Driver");
conn=DriverManager.getConnection(url, user, password);
} catch (ClassNotFoundException e) {
e.printStackTrace();
} catch (SQLException e) {
e.printStackTrace();
}
return conn;
}
}
dwr.xml代码如下:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN" "http://getahead.org/dwr/dwr30.dtd">
<dwr>
<allow>
<create creator="new" javascript="province">
<param name="class" value="dao.CityDao"></param>
</create>
<convert converter="bean" match="dao.Province"></convert>
<convert converter="bean" match="dao.City"></convert>
</allow>
</dwr>
实现省市级联的页面代码:
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%
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>My JSP 'index.jsp' starting page</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 type='text/javascript' src='/DWR/dwr/engine.js'></script>
<script type='text/javascript' src='/DWR/dwr/interface/province.js'></script>
<script type='text/javascript' src='/DWR/dwr/util.js'></script>
</head>
<body onload="getPro();">
所在地:<select onchange="getCity();" id="provicial" name="province"></select><select id="city" name="city"></select>
</body>
<script type="text/javascript">
//获得省份列表
function getPro() {
province.getProvince(callPro);
}
//城市返回函数
function callPro(data) {
var provical = document.getElementById("provicial");
provical.innerHTML = "";//如果有值就清空
provical.add(new Option('请选择', ''));
for ( var i = 0; i < data.length; i++) {//循环添加省份下拉列表
provicial.add(new Option(data[i].provincialName,
data[i].provincialID));
}
}
//根据省份ID获取相对应的城市列表
function getCity() {
var city = document.getElementById("provicial").value;
//获得省份下拉列表的值
province.getCity(city, callCity);
}
function callCity(data) {
var city = document.getElementById("city");//将城市下拉列表清空
city.innerHTML = "";
city.add(new Option('请选择', ''));
for ( var i = 0; i < data.length; i++) {//循环添加城市下拉列表
city.add(new Option(data[i].cityName, data[i].cityID));
}
}
</script>
</html>
其中所引用的js代码
<script type='text/javascript' src='/DWR/dwr/engine.js'></script>
<script type='text/javascript' src='/DWR/dwr/interface/province.js'></script>
<script type='text/javascript' src='/DWR/dwr/util.js'></script>
来自以下页面:
运行后,在浏览器地址栏输入:http://localhost:8080/DWR/dwr
页面如下:
点击黄颜色部分,进入页面:
上面的javascrip代码即为红色框内的内容。
最后,运行项目,运行结果为:
分享到:
相关推荐
实现省市级联效果 代码类 使用dwr实现省市级联实际开发例子
好资源,使用XML和dwr ajax 集成实现省市级联菜单 提供给大家学习
采用dwr+xml+tomcat实现三级级联菜单,代码解压即可运行
DWR框架的实现DWR框架的实现DWR框架的实现DWR框架的实现DWR框架的实现
dwr实现ajax功能ajax+dwr.........................
里面是用ssh整合做的一个简单的省市级联的例子,struts用的是1.3版本的 另外dwr实现了同样的功能
Ajax(DWR实现例子) Ajax(DWR实现例子) Ajax(DWR实现例子) Ajax(DWR实现例子) Ajax(DWR实现例子) Ajax(DWR实现例子)
ajax框架dwr实现的页面无刷新分页效果,jsp技术
DWR(Direct Web Remoting)是一个web远程调用框架,利用这个框架可以让AJAX变得很简单,通过DWR可以在客户端通过JavaScript直接调用服务器的Java方法并返回值给JavaScript,整个过程就好像通过本地客户端调用一样,...
dwr实现无刷新分页dwr实现无刷新分页dwr实现无刷新分页dwr实现无刷新分页dwr实现无刷新分页dwr实现无刷新分页dwr实现无刷新分页dwr实现无刷新分页
用数据库缓存池和dwr实现的jsp程序数据库缓存池和dwr实现的jsp程序
使用DWR实现服务器端向客户端精确推送消息
利用dwr技术实现的省市县三级联动的小例子,可以参考一下。
利用DWR实现文件上传进度条 利用DWR实现文件上传进度条 利用DWR实现文件上传进度条
在Java中使用dwr做的省市级联菜单的关键代码!
spring mvc+ibatis+dwr实现dispatchservlet还有一个省市级联
register(dwr实现用户注册) register(dwr实现用户注册) register(dwr实现用户注册)
用DWR实现分页,还有增删茶改
用DWR实现的一个树形..希望大家喜欢 .. 呵呵
SSH CRM项目DWR入门源码(4)通过DWR实现动态树源码(5) var sjzdflArr; DWREngine.setAsync(false); SjzdflDAO.findAll(load); DWREngine.setAsync(true); function load...