`
宋双旺
  • 浏览: 156843 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Jeecg v2.0 三级联动例子

阅读更多

 

页面效果如下图所示:

 

js代码如下图所示:

	//初始化省份、城市、区域下拉列表
 		$('#provinceId').combobox({
	 	    url:'demoAction!getProvinceJson.action',
		    valueField:'provinceId',
		    textField:'provinceName',
		    onChange:function(){
		     	 var provinceId = $('#provinceId').combobox('getValue');
		     	 $('#cityId').combobox({
			     	 url:'demoAction!getCityJsonByProvinceId.action?provinceId='+provinceId,
			      	 valueField:'cityId',
			         textField:'cityName',
					 onChange:function(){
				     	 var cityId = $('#cityId').combobox('getValue');
				     	 $('#areaId').combobox({
					     	 url:'demoAction!getAreaJsonByCityId.action?cityId='+cityId,
					      	 valueField:'areaId',
					         textField:'areaName',
							 });
				     }
				});
		    }
	   });
	})

 action代码如下图所示:

	// ××××××××××××××××××××××××××××××××××××××××××××××××××××××××××
	// ×××××××××××××××××××××××××××三级联动×××××××××××××××××××××××
	// ××××××××××××××××××××××××××××××××××××××××××××××××××××××××××	
	
	//进入上传页面
	public String menuButton3(){
		return "combobx3";
	}	
	//-----------------------得到区域列表---------------------------
	//浏览器传递过来的信息	
	private String cityId;
	
	public String getCityId() {
		return cityId;
	}
	public void setCityId(String cityId) {
		this.cityId = cityId;
	}


	public void getAreaJsonByCityId(){
		JSONArray jsonArray = new JSONArray();
		JSONObject jsonObj = new JSONObject();
		if("ft".equals(cityId)){
			jsonObj.put("areaId", "xwy");
			jsonObj.put("areaName", "小瓦窑");
			jsonObj.put("selected", true);
			JSONObject jsonObj2 = new JSONObject();			
			jsonArray.add(jsonObj);					
			jsonObj2.put("areaId", "yql");
			jsonObj2.put("areaName", "玉泉路");
			jsonArray.add(jsonObj2);					
		}
		if("hd".equals(cityId)){
			jsonObj.put("areaId", "zgc");
			jsonObj.put("areaName", "中关村");
			jsonObj.put("selected", true);
			JSONObject jsonObj2 = new JSONObject();			
			jsonArray.add(jsonObj);					
			jsonObj2.put("areaId", "sd");
			jsonObj2.put("areaName", "上地");
			jsonArray.add(jsonObj2);					
		}
		writeJson(jsonArray);		
	}	

 

  • 大小: 48.8 KB
分享到:
评论

相关推荐

    struts2.0三级联动 json

    三级联动是一种常见的功能需求,通常出现在下拉框的选择中,例如省份、城市、区县的关联选择,用户选择一个省份后,城市选项会动态更新,选择城市后,区县选项也会相应更新。这种功能的实现依赖于前端和后端的紧密...

    省市区三级联动下拉列表

    在这个例子中,我们可以看到一个使用 JavaScript 实现的三级联动下拉列表。 知识点1:JavaScript 数组 在上面的代码中,我们可以看到使用了两个数组,citys 和 countys。这些数组存储了省市区的信息,用于实现三级...

    uniapp使用uview组件实现省市区三级联动

    在本文中,我们将深入探讨如何在uni-app框架中利用uView UI组件库来实现省市区三级联动的效果。uni-app是一个基于Vue.js的多端开发框架,它允许开发者编写一次代码,即可在iOS、Android、H5、小程序等多个平台运行。...

    【2020年05月更新,官网实时更新】省市区三级联动/中国省市区地址三级联动/全国省市区三级联动数据下载

    提供目前中国全部行政区域的省(市/自治区)、市(区/自治州)、区(县/市)三级联动最新数据,可以用于各类应用开发。2019年10月31日,我公司(www.ebaitian.cn)决定将中国最新的行政区划数据向社会公众共享,以...

    三级联动demo

    在IT行业中,"三级联动"通常指的是在一个交互界面中,三个相关的下拉菜单或选择框之间存在联动关系,即一个选项的选择会影响到下一个选项的显示内容。这种设计常见于地址选择,例如选择省份后,市的选择会更新为对应...

    三级联动例子

    三级联动例子

    ASPX 三级联动例子

    在这个"ASPX 三级联动例子"中,我们可以预见到这是一个教学或示例项目,旨在帮助初学者理解和实现这样的功能。WebApplication1可能是这个项目的根目录,其中包含了实现三级联动所需的所有文件,包括ASP.NET的页面(....

    微信小程序-省市县三级联动,带有自定义地区码(源代码+截图)

    微信小程序-省市县三级联动,带有自定义地区码(源代码+截图)微信小程序-省市县三级联动,带有自定义地区码(源代码+截图)微信小程序-省市县三级联动,带有自定义地区码(源代码+截图)微信小程序-省市县三级联动,带有...

    一个最简单的三级联动代码

    在IT行业中,三级联动是一种常见的交互设计模式,尤其在数据筛选和导航系统中十分常见。这个"一个最简单的三级联动代码"示例可能是用来帮助开发者理解如何实现这种功能的。下面我们将深入探讨三级联动的基本概念、...

    ASP三级联动下拉菜单

    在这个例子中,我们可以看到,三级联动下拉菜单是通过三个表格实现的:thatchina_class_1、thatchina_class_2和thatchina_class_3。每个表格都有其对应的字段,例如class1_id、class1_name、class2_id、belongto_...

    世界主要国家地区的JS三级联动(包括国内的省市区三级联动)

    在本文中,我们将深入探讨如何实现一个包括世界主要国家和地区在内的三级联动效果,以及在国内省市区的三级联动功能。这个功能常用于地址选择、区域筛选等场景,可以提供用户友好的交互体验。 首先,我们要理解什么...

    RecyclerView三级联动

    在Android开发中,"RecyclerView三级联动"是一种常见的交互设计,尤其在展示层级关系的数据时,如商品分类、地区选择等场景。RecyclerView作为Android系统提供的一个高效、可复用的列表视图,能够处理大量数据并提供...

    三级联动源码

    在IT领域,"三级联动"通常指的是在网页或应用程序中的一种交互设计,它涉及到三个层次的数据关联和选择。这种设计常见于下拉菜单或者地区选择等场景,例如省-市-区的选择,用户在选择一个省份后,下一级的市会根据...

    js+jsp三级联动 源码

    在IT行业中,"js+jsp三级联动 源码"是一个常见的前端与后端交互的实践案例,主要用于实现用户界面的动态筛选和过滤。这里,我们主要探讨的是使用JavaScript(js)和JavaServer Pages(jsp)来创建一个具有三级联动...

    jsp+ajax 三级联动菜单

    在这个例子中,我们看到的是一个菜单系统,通过用户的选择,能够逐级展示下一级别的菜单选项,形成一种“三级联动”的效果。这种功能常见于地区选择、类别筛选等场景,为用户提供方便的交互体验。 首先,我们需要...

    移动端、h5省市区三级联动

    在移动端和H5开发中,省市区三级联动是一种常见的功能需求,主要用于地址选择,提供用户一个方便快捷的方式来选择他们的详细地址。本示例提供了一款适用于这两种平台的三级联动组件,下面将详细介绍这个功能及其实现...

    三级联动效果

    在网页设计和开发中,"三级联动效果"是一种常见的交互设计模式,特别是在处理地理区域选择、类别筛选等场景。这种效果通常涉及到三个下拉选择框,它们之间存在依赖关系:第一个下拉框的选择会影响第二个下拉框的内容...

    最全省市区三级联动excel表格

    标题中的“最全省市区三级联动excel表格”指的是一个专门设计用于实现中国省、市、区三级数据联动的Excel表格模板。这种表格通常用于数据管理、统计分析或在Web应用程序中创建下拉选择框,以便用户可以按顺序选择...

    asp二级联动下拉框,三级联动下拉框

    在ASP中,二级联动和三级联动下拉框是常见的功能,通常用于实现数据的筛选和过滤,例如在地区选择、商品分类等场景。下面将详细讲解如何在ASP中实现这些功能。 ### 二级联动下拉框 二级联动下拉框是指两个下拉框...

    世界城市三级联动(中英文)插件

    《世界城市三级联动(中英文)插件》是一款专门用于网页中实现城市选择功能的JavaScript插件。这个插件的特点在于其提供了三级联动的效果,即国家-省份-城市的选择,同时支持中文和英文两种语言,使得全球用户都能...

Global site tag (gtag.js) - Google Analytics