Easyui表单之下拉列表的三级联动
一、实现三级联动需要连接数据库
二、需要JSON数据的解析
三、需要Servlet类与界面相对应值的传递
1. 界面层需要的代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</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>
这是修改员工的页面 <input class="easyui-combobox"data-options="url:'json/combo.json',
valueField:'id',textField:'text',
editable:false"> <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');// 清除原有项目
$('#quxian').combobox('clear');// 清除原有显示项目
// 重新加载
$('#shi').combobox('reload','RegionServlet?parentid='+region.regionID);
$('#quxian').combobox('reload','RegionServlet'); //清理原有下拉项目 }
}">
市：<input id="shi" class="easyui-combobox" style="width:100px"
data-options="{
url:'RegionServlet',
valueField:'regionID',
textField:'regionName',
onSelect:function(region)
{
$('#quxian').combobox('clear');// 清除原有项目
// 重新加载
$('#quxian').combobox('reload','RegionServlet?parentid='+region.regionID);
} }">
区县：<input id="quxian" class="easyui-combobox" style="width:100px"
data-options="{
url:'RegionServlet',
valueField:'regionID',
textField:'regionName'
}">
</body>
</html>
2. 通过hibernate创建实体类与映射文件
实体类：
package com.hanqi.entity; // 地区实体类
public class Region { // 地区ID
private String regionID; // 地区名称
private String regionName; // 上级地区ID
private String parentRegionID; public String getRegionID() {
return regionID;
} public void setRegionID(String regionID) {
this.regionID = regionID;
} public String getRegionName() {
return regionName;
} public void setRegionName(String regionName) {
this.regionName = regionName;
} public String getParentRegionID() {
return parentRegionID;
} public void setParentRegionID(String parentRegionID) {
this.parentRegionID = parentRegionID;
} }
3.DAO层代码：
package com.hanqi.dao; import java.util.ArrayList;
import java.util.List; import org.hibernate.Session;
import org.hibernate.SessionFactory;
import org.hibernate.Transaction;
import org.hibernate.boot.registry.StandardServiceRegistryBuilder;
import org.hibernate.cfg.Configuration;
import org.hibernate.service.ServiceRegistry; import com.hanqi.entity.Region; public class RegionDAO { Configuration cfg = null;
ServiceRegistry sr =null;
SessionFactory sf =null;
Session se=null;
Transaction tr=null;
public RegionDAO()
{
//加载配置文件
cfg = new Configuration().configure();
//注册服务
sr = new StandardServiceRegistryBuilder()
.applySettings(cfg.getProperties())
.build();
}
// 初始化
private void init()
{
sf=cfg.buildSessionFactory(sr);
se= sf.openSession();
tr=se.beginTransaction();
}
// 提交和释放
private void destory()
{
tr.commit();
se.close();
sf.close();
} // 获取数据列表 public List<Region> getList(String parentid)
{ List<Region> rtn = new ArrayList<Region>(); init(); // 查询数据
rtn=se.createQuery("from Region where parentRegionID = ?")
.setString(0, parentid).list(); destory(); return rtn;
}
}
4.Service层代码：
package com.hanqi.service; import java.util.List; import com.hanqi.dao.RegionDAO;
import com.hanqi.entity.Region; public class RegionService { public List<Region> getList(String parentid)
{
return new RegionDAO().getList(parentid);
} }
5.Servlet层代码：（解析JSON数据的jar包FastJson）
package com.hanqi.controller; import java.io.IOException;
import java.util.List; import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; import com.alibaba.fastjson.JSONArray;
import com.hanqi.entity.Region;
import com.hanqi.service.RegionService; public class RegionServlet extends HttpServlet {
private static final long serialVersionUID = 1L; public RegionServlet() {
super(); } protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding("UTF-8");
response.setCharacterEncoding("UTF-8");
response.setContentType("text/html"); // 接收参数
String parentid = request.getParameter("parentid"); if(parentid!=null)
{ // 读取地区代表
List<Region> lr = new RegionService().getList(parentid);
;
// 返回JSON格式的数据
String json = JSONArray.toJSONString(lr); response.getWriter().write(json);
}
else
{
response.getWriter().write("[]");
}
} protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doGet(request, response);
} }
Easyui表单之下拉列表的三级联动的更多相关文章
- easyui表单插件-包括日期时控件-列表
← jQuery EasyUI 表单插件 – Numberspinner 数值微调器 jQuery EasyUI 表单插件 - Timespinner 时间微调器 jQuery EasyUI 插件 ...
- easyui表单提交，后台获取不到值
J2ee开发,使用easyui表单提交,在ie中可以正常将参数传递到后台,但使用firefox,chrome都无法将easyui的combobox值传递到后台,使用alert($('#form').s ...
- easyUI表单基础知识
easyUI创建异步提交表单 我们创建一个带有 name.email 和 phone 字段的表单.通过使用 easyui 表单(form)插件来改变表单(form)为 ajax 表单(form).表单 ...
- EasyUI表单验证，自定义插件验证，自定义js插件验证，远程验证，常见手机号，中英文，qq等验证规则验证
{ field : 'startPort', title : "起始端口", editor: "text", width : 50, editor: { ...
- JQuery EasyUI 表单
EasyUI 创建异步提交表单 ♦ 通过使用 easyui 表单插件来改变表单为 ajax表单. 表单提交所有字段到后台服务器,服务器处理和发送一些数据返回到前端页面.我们接收返回数据,并将它显示出来 ...
- 雷林鹏分享：jQuery EasyUI 表单 - 创建异步提交表单
jQuery EasyUI 表单 - 创建异步提交表单 本教程向您展示如何通过 easyui 提交一个表单(Form).我们创建一个带有 name.email 和 phone 字段的表单.通过使用 e ...
- 雷林鹏分享：jQuery EasyUI 表单 - 创建树形下拉框
jQuery EasyUI 表单 - 创建树形下拉框 树形下拉框(ComboTree)是一个带有下列树形结构(Tree)的下拉框(ComboBox).它可以作为一个表单字段进行使用,可以提交给远程服务 ...
- 雷林鹏分享：jQuery EasyUI 表单 - 表单验证
jQuery EasyUI 表单 - 表单验证 本教程将向您展示如何验证一个表单.easyui 框架提供一个 validatebox 插件来验证一个表单.在本教程中,我们将创建一个联系表单,并应用 v ...
- 雷林鹏分享：jQuery EasyUI 表单 - 过滤下拉数据网格
jQuery EasyUI 表单 - 过滤下拉数据网格 下拉数据网格(Combogrid)组件和下拉框(Combobox)组件的共同点是,除了都具有下拉面板以外,它们都是基于数据网格(Datagrid ...
随机推荐
- 用两个Stack来实现一个Queue
import java.util.Stack; /** * 问题:用两个Stack来实现一个Queue; * 方法:栈的特点是先进后出:而队列的特点是先进先出: * 用两个栈正好能把顺序调过来: * ...
- C++坑点集合 - 1 隐式调用和默认实现的构造函数的坑
C++是一个编译器会替你在背后做很多事情的语言,包括模板实例化,按需要创造隐式的构造函数,默认构造你没有显式构造的成员,按需进行隐式转换和饮食构造等等,如果没有彻底了解清楚,就容易被这些编译器背后做好 ...
- Java性能调优
一.JVM内存模型及垃圾收集算法 1.根据Java虚拟机规范,JVM将内存划分为: New(年轻代) Tenured(年老代) 永久代(Perm) 其中New和Tenured属于堆内存,堆内存会从JV ...
- linux socket编程实例
/* ============================================================================ Name : client.c Auth ...
- matlab工具箱之人眼检测+meanshift跟踪算法--人眼跟踪
Viola-Jones 人眼检测算法+meanshift跟踪算法 这次的代码是对视频中的人眼部分进行检测加跟踪,检测用的是matlab自带的人眼检测工具箱 下面是matlab官网介绍这个算法的一些东西 ...
- css3画三角形的原理
以前用过css3画过下拉菜单里文字后面的“下拉三角符号”,类似于下面这张图片文字后面三角符号的效果 下面是一个很简单的向上的三角形代码 #triangle-up { width: 0; height: ...
- DataGridView 导出到Excel
#region 导出四个表格到Excel /// <summary> /// 导出四个表格到Excel /// </summary> /// <param name=&q ...
- Spring框架的XML扩展特性
Spring框架从2.0版本开始,提供了基于Schema风格的XML扩展机制,允许开发者扩展spring配置文件.现在我们来看下怎么实现这个功能,可以参考spring帮助文档中的<Extensi ...
- Python多线程互斥锁
import threading import time num=0 def Mylock(lock): global num lock.acquire() num=num+1 time.sleep( ...
- Ejabberd作为推送服务的优化手段
AVOS Cloud目前还在用Ejabberd做Android的消息推送服务.当时选择Ejabberd,是因为Ejabberd是一个发展很长时间的XMPP实现,并且基于Erlang,设想能在我们自主研 ...