首页 > 代码库 > easyUI下拉列表三级联动
easyUI下拉列表三级联动
首先是先想好数据库的搭建，通过地区id，地区名称，上级地区id就可以实现，所有省市区的数据
例如：
DAO层
service层
Servlet
页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>修改员工</title>
<!-- 顺序不可以乱 -->
<!-- 1.jQuery的js包 -->
<script type="text/javascript" src="http://www.mamicode.com/jquery-easyui-1.4.4/jquery.min.js"></script>
<!-- 2.css资源 -->
<link rel="stylesheet" type="text/css" href="http://www.mamicode.com/jquery-easyui-1.4.4/themes/default/easyui.css">
<!-- 3. 图标资源 -->
<link rel="stylesheet" type="text/css" href="http://www.mamicode.com/jquery-easyui-1.4.4/themes/icon.css">
<!-- 4.easyui的js包 -->
<script type="text/javascript" src="http://www.mamicode.com/jquery-easyui-1.4.4/jquery.easyui.min.js"></script>
<!-- 5.本地语言 -->
<script type="text/javascript" src="http://www.mamicode.com/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下拉列表三级联动
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。