首先是先想好数据库的搭建，通过地区id，地区名称，上级地区id就可以实现，所有省市区的数据

例如：

DAO层

service层

Servlet

页面

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>修改员工</title>

<!-- 顺序不可以乱 -->

<!-- 1.jQuery的js包 -->

<script type="text/javascript" src="jquery-easyui-1.4.4/jquery.min.js"></script>

<!-- 2.css资源 -->

<link  rel="stylesheet" type="text/css" href="jquery-easyui-1.4.4/themes/default/easyui.css">

<!-- 3. 图标资源 -->

<link  rel="stylesheet" type="text/css" href="jquery-easyui-1.4.4/themes/icon.css">

<!-- 4.easyui的js包 -->

<script type="text/javascript" src="jquery-easyui-1.4.4/jquery.easyui.min.js"></script>

<!-- 5.本地语言 -->

<script type="text/javascript" src="jquery-easyui-1.4.4/locale/easyui-lang-zh_CN.js"></script>

</head>

<body>

修改员工的页面

<br><br>

<input class="easyui-combobox" id="cc1"

data-options="url:'json/combox.json',

valueField:'id',

textField:'text',

">

<br><br>

省：<input id="sheng" class="easyui-combobox" style="width:100px"

data-options="

url:'RegionServlet?parentid=0',

valueField:'regionID',

textField:'regionName',

onSelect:function(region){

//alert('选择了省id='+region.regionID);

$('#shi').combobox('clear');//清除原有项目

$('#qu').combobox('clear');//清除原有项目

$('#shi').combobox('reload','RegionServlet?parentid='+region.regionID);//重新加载

$('#qu').combobox('reload','RegionServlet')//清楚原有下拉项目

}" /> 

市：<input id="shi" class="easyui-combobox" style="width:100px"

data-options="

url:'RegionServlet',

valueField:'regionID',

textField:'regionName',

onSelect:function(region){

//alert('选择了市id='+region.regionID);

$('#qu').combobox('clear');//清除原有项目

$('#qu').combobox('reload','RegionServlet?parentid='+region.regionID);

}" />

区：<input id="qu" class="easyui-combobox" style="width:100px"

data-options="

url:'RegionServlet',

valueField:'regionID',

textField:'regionName'" />

</body>

</html>

　　

注意：在三级联动的时候要清除原有项目和清除下一级的下拉数据，否则就会出现在改变省份的时候，市区这两个下拉框还会显示上次所选的省份的所在市区。

easyUI下拉列表三级联动的更多相关文章

  1. MVC 下拉列表三级联动

    当前所做的项目,关于数据库设计的时候有点小意思,表A是三个联合主键,key1,key2,key3,表B是四个联合主键 key1,key2,key3,key4,其中表B的联合外键关联表A对应的联合主键, ...

  2. JAVA EE 中之AJAX 无刷新地区下拉列表三级联动

    JSP页面 <html> <head> <meta http-equiv="Content-Type" content="text/html ...

  3. Ajax省市地区下拉列表三级联动

    SQL数据库表 --创建Province表 CREATE TABLE [dbo].[Province]( [Id] [int] NULL, [Name] [varchar](50) NULL, [or ...

  4. Easyui表单之下拉列表的三级联动

    一.实现三级联动需要连接数据库 二.需要JSON数据的解析 三.需要Servlet类与界面相对应值的传递 1. 界面层需要的代码如下: <!DOCTYPE html> <html&g ...

  5. Android实现三级联动下拉框 下拉列表spinner

    Android实现(省.市.县)三级联动下拉框 下拉列表spinner 转载请注明出处: http://www.goteny.com/articles/2013/11/46.html http://w ...

  6. Java下使用Apache POI生成具有三级联动下拉列表的Excel文档

    使用Apache POI生成具有三级联动下拉列表的Excel文档: 具体效果图与代码如下文. 先上效果图: 开始贴代码,代码中部分测试数据不影响功能. 第一部分(核心业务处理): 此部分包含几个方面: ...

  7. easyui commobox省市区县三级联动

    1.前端代码 <div class="col-6 f-group"> <label class="col-4 left_red"> 省名 ...

  8. JavaScript 三级联动

    附件连接下载地址:http://files.cnblogs.com/files/CaktyRiven/js.zip <!DOCTYPE html> <html lang=" ...

  9. Webform——中国省市三级联动以及IsPostBack

    首先要明白Webform的运行顺序,当开始启动时候,首先执行的是Page_Load事件, 当点击任意按钮后,每次点击都要先执行一遍Page_Load(在这里Page_Load里面的事件是给数据控件加载 ...

随机推荐

  1. MRDS学习四——自动型机器车

    由自己的所在开始,探索自己周围的简单机器车,假设车子的行走路径如下: 我们要把L型路径写成一个Activity,然后由外部输入这个L的大小,最后这个Activity要能够在完成行走路径时吐出更大的L大 ...

  2. 转 C# 只允许运行一个实例

    来源:http://blog.csdn.net/jin20000/article/details/3136791 互斥进程(程序), 简单点说,就是在系统中只能有该程序的一个实例运行. 现在很多软件都 ...

  3. .net 根据银行卡获取银行信息

    using System; using System.Collections.Generic; using System.Linq; using System.Web; /// <summary ...

  4. window跳转页面

    1.直接的事件跳转 window.location.href="你所要跳转的页面"; 2.新窗口跳转 window.open('你所要跳转的页面'); 3.返回上一页 window ...

  5. NVelocity介绍，NVelocity中文手册文档及实例下载

    NVelocity是什么velocity英音:[vi'lɔsiti]美音:[və'lɑsətɪ]近在做一个项目,客户要求有网站模板功能,能够自主编辑网站的风格,因为这个系统是为政府部门做子站系统,举个 ...

  6. tomcat相关问题

    动态资源:需要转换成静态资源后再响应给客户端,例如:jsp.servlet,其他语言的动态资源有:asp.php 静态资源:无需转发即可直接响应给客户端,例如:html.css.javascript ...

  7. preparestatement可以避免注入

    之所以PreparedStatement能防止注入,是因为它把单引号转义了,变成了\',这样一来,就无法截断SQL语句,进而无法拼接SQL语句,基本上没有办法注入了. 不使用这个,我们一般做查询或更新 ...

  8. [mysql]数据库基础知识

    数据库管理系统DBMS 软件 bin config db (保存数据) 写程序: 数据库在本地 找到目录 添加数据 数据库在远程 socket连接上远程机器 socket发送命令 需要做的事情 程序 ...

  9. CSS中定义CLASS时，中间有空格和每空格的区别

    css选择器的格式,规定不带空格的选择条件之间是“且”关系,带空格的是“父子”关系,并且可以是非直接的“父子”关系 <style> .e1.e2 { background-color:ye ...

  10. LeetCode 372

    题目: Your task is to calculate a^b mod 1337 where a is a positive integer and b is an extremely large ...