1.前端代码
<div class="col-6 f-group">
<label class="col-4 left_red">
省名称
</label>
<div class="col-8">
<input type="text" id="province" name="province"
readonly hidden="hidden"/>
<input type="text" id="province_name" panelHeight="100" name="province_name"
dataType="Require"
msg="省名称不能为空"/>
</div>
</div>
<div class="col-6 f-group">
<label class="col-4 left_red">
市名称
</label>
<div class="col-8">
<input type="text" id="city_code" name="city_code"
readonly hidden="hidden"/>
<input type="text" id="city_name" panelHeight="100" name="city_name"
dataType="Require"
msg="市名称不能为空"/>
</div>
</div> <div class="col-6 f-group">
<label class="col-4 left_red">
区县名称
</label>
<div class="col-8">
<input type="text" id="county_code" name="county_code"
readonly hidden="hidden"/>
<input type="text" id="county_name" panelHeight="100" name="county_name" dataType="Require"
msg="区县名称不能为空"/>
</div>
</div>

2.javascript代码
/**easyui省市区县三级联动开始**/ /**省级**/
$(function () {
$("#province_name").combobox({
valueField: 'name',//值字段
url: "${base}/baseinfo/district/getAllProvince?region=province",
textField: 'name',//显示字段
method: 'POST',
editable: false,//不可编辑只能选择
value: ' 请选择 ',
onSelect: function (obj) {
$("#city_name").combobox("setValue", ' 请选择 ');//清除市列表
$("#county_name").combobox("setValue", '');//清除区县列表
$("#city_code").val('');//清除市编码
$("#county_code").val('');//清除区县编码 $('#province').val(obj.code); $('#city_name').combobox('reload', "${base}/baseinfo/district/getAllCity?region=city&&id=" + obj.id);
}
});
/**市级**/
$("#city_name").combobox({
valueField: 'name',//值字段
textField: 'name',//显示字段
editable: false,//不可编辑只能选择
value: ' ',
onSelect: function (obj) {
$("#county_name").combobox("setValue", ' 请选择 ');//清除区县列表
$("#county_code").val('');//清除区县编码
$('#city_code').val(obj.code);
//$('#city').combobox('clear');
$('#county_name').combobox('reload', "${base}/baseinfo/district/getAllCounty?region=county&&id=" + obj.id);
}
}); //生成随机数
function RndNum(n) {
var rnd = "";
for (var i = 0; i < n; i++)
rnd += Math.floor(Math.random() * 10);
return rnd;
} /**区县级**/
$("#county_name").combobox({
valueField: 'name',//值字段
textField: 'name',//显示字段
editable: false,//不可编辑只能选择
value: ' ',
onSelect: function (obj) {
$('#county_code').val(obj.code);
var x = obj.code + RndNum(2);
$('#street_code').val(x);
var y = x + RndNum(2);
$('#community_code').val(y);
$('#residentia_code').val(y + RndNum(2));
}
});
}); /**easyui省市区县三级联动结束**/

3.控制层代码
/**获得省级信息**/
@RequestMapping(value = "getAllProvince", method = RequestMethod.POST)
@ResponseBody
public List<DistrictDomain> getAllProvince(String region) throws Exception {
DistrictDomain domain = new DistrictDomain();
domain.setRegion(region);
List<DistrictDomain> list=Collections.emptyList();
list = districtService.query(domain);
return list;
}
/**获得市级信息**/
@RequestMapping(value = "getAllCity", method=RequestMethod.POST)
@ResponseBody
public List<DistrictDomain> getAllProvince(@Param("region") String region,@Param("id") Long id) throws Exception {
DistrictDomain domain = new DistrictDomain();
domain.setId(id);
domain.setRegion(region);
List<DistrictDomain> list=Collections.emptyList();
list = districtService.query(domain);
return list;
}
/**获得区县信息**/
@RequestMapping(value = "getAllCounty", method=RequestMethod.POST)
@ResponseBody
public List<DistrictDomain> getAllCounty(@Param("region") String region,@Param("id") Long id) throws Exception {
DistrictDomain domain = new DistrictDomain();
domain.setId(id);
domain.setRegion(region);
List<DistrictDomain> list=Collections.emptyList();
list = districtService.query(domain);
return list;
}

easyui commobox省市区县三级联动的更多相关文章

  1. 省市区县三级联动JAVA+MySQL+JQuery

    场景介绍: 由于项目要求,需要做一个进件(新增)功能,而该功能里要用到车品牌.车系.车型的联动查询,也就是经典的三级联动. 大体思路如下: 进入页面,会把所有的车品牌(第一级)在后台查询出来,放到缓存 ...

  2. 基于Jquery实现省份、城市、区县三级联动

    前端感觉写的比较少,也是为了练手,下午没事用来写了这个三级联动,也是第一次写这东西. 据我了解,城市信息可以选择存在数据库或者直接写在前端,为了省事,我直接写在前端,下面是我的代码: <!DOC ...

  3. echarts地图边界数据的实时获取与应用,省市区县多级联动【附最新geoJson文件下载】

    首先,来看下效果图 在线体验地址:https://hxkj.vip/demo/echartsMap/,并提供实时geoJson数据文件下载 echarts官方社区链接地址(可在线编辑):https:/ ...

  4. 省份、城市、区县三级联动Html代码

    <!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...

  5. JQuery EasyUI combobox 省市两级联动

    表名:province  结构如下 CallIn.tpl 模板页 <select id="consult_province" name="consult_provi ...

  6. easyui+ef实现省市区三级联动

    1.引用easyui样式及脚本文件 2.数据库创建表(自联表)及数据建模(Code First) use DataBase go CREATE TABLE OP_SJ ( CID UNIQUEIDEN ...

  7. ajax省市线三级联动

    <script type='text/javascript' src='http://ajax.useso.com/ajax/libs/jquery/1.7.2/jquery.min.js?ve ...

  8. echarts 中国地图实现 省、市、区县三级联动,省级下钻、市级下钻

    每天学习一点点 编程PDF电子书.视频教程免费下载:http://www.shitanlife.com/code 效果如下图: 每天学习一点点 编程PDF电子书.视频教程免费下载:http://www ...

  9. 循序渐进VUE+Element 前端应用开发(21)--- 省市区县联动处理的组件使用

    在很多应用中,往往都涉及到记录用户所在省份.城市.区县或者街道等信息,一般我们可以通过联动的Select或者类似的界面组件进行展示,或者使用Element中的el-cascader界面组件进行展示,而 ...

随机推荐

  1. codeforces-1138 (div2)

    想法题是硬伤,面对卡题和卡bug的情况应对能力太差 A.求两个前缀和以及两个后缀和,相邻最小值的最大值. #include<iostream> using namespace std; ; ...

  2. VS2012/2013/2015/Visual Studio 2017 关闭单击文件进行预览的功能

    Visual Studio在2010版本后推出了点击项目管理器预览文件的功能,但是对于配置不咋地的旧电脑总是觉得有点卡,下面是解决方案. 英文版方法:Tools->Options->Env ...

  3. 数字化IT人才与组织

    企业的数字化目标 数字时代需要怎样的IT 数字化平台战略 产品一体化交付能力 产品设计与规划的能力 路线图 数字人才框架 Tips: 赋能授权(Empowerment)是近年来应最多的商业语汇之一.赋 ...

  4. Silverlight Visifire控件应用去除图标的水印

    首先,新建一个类,继承自Chart,重写LoadWatermark方法. 再创建图表实例的时候就不能new Chart实例了,直接使用MyCharts. 使用去除水印之前的图片: 使用去除水印之后的图 ...

  5. Subsequence(序列自动机模板题)

    题目链接:https://nanti.jisuanke.com/t/38232 题目大意:给你一个字符串,然后再给你m个字符串,然后问你在第一个字符串中不连续的子串能不能构成输入的子串. 具体思路:构 ...

  6. 论文笔记系列-Well Begun Is Half Done:Generating High-Quality Seeds for Automatic Image Dataset Construction from Web

    ​ ​ ​ MARSGGBO♥原创 2019-3-2

  7. torch.linspace,unsqueeze()以及squeeze()函数

    1.torch.linspace(start,end,steps=100,dtype) 作用是返回一个一维的tensor(张量),其中dtype是返回的数据类型. import torch print ...

  8. keepalived健康检查方式【转】

    keepalived具有很强大.灵活的后端检测方式,其具有HTTP_GET|SSL_GET|TCP_CHECK|SMTP_CHECK|MISC_CHECK 几种健康检测方式 ,在分别介绍各种检测方式之 ...

  9. nginx日志的监控【转】

    第一:nginx的基础监控: 1.进程监控 2.端口监控 在这里nginx的基础监控就不详细说了,注意的是:这两个是必须要加的.并且对于zabbix而言的话,一定要加上触发器的.有问题必须报警. 第二 ...

  10. MySQL问题汇总

    1.中文乱码 连接设置: 数据库设置: