首先是先想好数据库的搭建，通过地区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. linux下共享库的注意点之-fpic

    在编译共享库必须加上-fpic.这是为什么呢? 首先看一个简单的例子: #include <stdio.h> int fun1() { printf("fun1\n") ...

  2. 如何设置phpMyAdmin自动登录和取消自动登录

    如何设置phpMyAdmin自动登录? 首先在根目录找到config.sample.inc.php复制一份文件名改为config.inc.php(如果已经存在 config.inc.php 文件,则直 ...

  3. bash 语法使用

    1.定义函数时,不需要使用function作为函数的命名. 函数不需要形参. 函数名不能以数字作为开头 main() { in ) 1_start ;; ) 1_start 5_start ;; ) ...

  4. Java 网络编程之 Socket

    ========================UDP============================= UDP---用户数据报协议,是一个简单的面向数据报的运输层协议. UDP不提供可靠性, ...

  5. html中表格元素的相关总结

    表格元素相关总结: 1.在CSS中,内部表元素(如td.tr.col等)生成矩形框,这些矩形框包含内容.内边距和边框,但没有外边距,因此如果定义外边距,浏览器将忽略该定义:对于table元素,外边距有 ...

  6. Reverse Integer

    Reverse digits of an integer. Example1: x = 123, return 321Example2: x = -123, return -321 public cl ...

  7. ffmpeg-20160901-bin.7z

    ESC 退出 0 进度条开关 1 屏幕原始大小 2 屏幕1/2大小 3 屏幕1/3大小 4 屏幕1/4大小 5 屏幕横向放大 20 像素 6 屏幕横向缩小 20 像素 S 下一帧 [ -2秒 ] +2 ...

  8. sys/types.h fcntl.h unistd.h sys/stat.h

    sys/types.h 是Unix/Linux系统的基本系统数据类型的头文件,含有size_t,time_t,pid_t等类型. 在应用程序源文件中包含 <sys/types.h> 以访问 ...

  9. iOS Waxpatch项目(动态更新)

    我的iOS Waxpatch项目地址https://github.com/piaojin/iOS-WaxPatch

  10. 使用 CUDA范例精解通用GPU编程 配套程序的方法

    用vs新建一个cuda的项目,然后将系统自动生成的那个.cu里头的内容,除了头文件引用外,全部替代成先有代码的内容. 然后程序就能跑了. 因为新建的是cuda的项目,所以所有的头文件和库的引用系统都会 ...