下拉列表---demo---bai

select.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <base href="<%=basePath%>">

    <title>My JSP 'select.jsp' starting page</title>

	<meta http-equiv="pragma" content="no-cache">

	<meta http-equiv="cache-control" content="no-cache">

	<meta http-equiv="expires" content="0">

	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

	<meta http-equiv="description" content="This is my page">

	<!--

	<link rel="stylesheet" type="text/css" href="styles.css">

	-->

  </head>

  <script src="js/myajax.js">  <!--导入外部的js文件-->

  </script>

  <script type="text/javascript">

  function send_ajax_request_fordept()

  {

   //b 通过open方法连接服务器

   var method ="get";

   var url = "DeptServlet";//

   var paras = "op=findall";

	//调用myajax.js中的send_ajax_request简化代码

    send_ajax_request(method,url,paras,doreceive_dept) ;

  }

  //发送ajax请求，查找该部门对应的员工

  function send_ajax_request_foremp()

  {

   var method = "get";

   var deptid = document.getElementById("dept").value;

   var url = "DeptServlet";

   var paras = "op=findbydepid&deptid="+deptid;

	//调用myajax.js中的send_ajax_request简化代码

    send_ajax_request(method,url,paras,doreceive_emp) ;

   }

  //处理部门的响应数据

  function doreceive_dept()

  {

  	if(xmlHttpRequest.readyState==4&&xmlHttpRequest.status==200)

  	{

  		//alert(xmlHttpRequest.responseText);

  		//将ajax响应作为下拉列表的内部html

  		document.getElementById("dept").innerHTML = xmlHttpRequest.responseText;

  		send_ajax_request_foremp();

  	}

  }

    //处理员工的响应数据

  function doreceive_emp()

  {

  	if(xmlHttpRequest.readyState==4&&xmlHttpRequest.status==200)

  	{

  		//alert(xmlHttpRequest.responseText);

  		//将ajax响应作为下拉列表的内部html

  		document.getElementById("emp").innerHTML = xmlHttpRequest.responseText;

  	}

  }

  </script>

  <body onload="send_ajax_request_fordept()">

    请选部门

    <select id="dept" name="dept" onchange="send_ajax_request_foremp()">

    	<option value="-1">请选择...</option>

    </select>

   

  员工<select id="emp" name="emp">

    	<option value="-1">请先选择部门...</option>

    </select>

  </body>

</html>

DeptServlet

import java.io.IOException;

import java.io.PrintWriter;

import java.util.List;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

public class DeptServlet extends HttpServlet {

	/**

	 * Constructor of the object.

	 */

	public DeptServlet() {

		super();

	}

	/**

	 * Destruction of the servlet. <br>

	 */

	public void destroy() {

		super.destroy(); // Just puts "destroy" string in log

		// Put your code here

	}

	/**

	 * The doGet method of the servlet. <br>

	 *

	 * This method is called when a form has its tag value method equals to get.

	 *

	 * @param request the request send by the client to the server

	 * @param response the response send by the server to the client

	 * @throws ServletException if an error occurred

	 * @throws IOException if an error occurred

	 */

	public void doGet(HttpServletRequest request, HttpServletResponse response)

			throws ServletException, IOException {

		doPost(request,response);

	}

	/**

	 * The doPost method of the servlet. <br>

	 *

	 * This method is called when a form has its tag value method equals to post.

	 *

	 * @param request the request send by the client to the server

	 * @param response the response send by the server to the client

	 * @throws ServletException if an error occurred

	 * @throws IOException if an error occurred

	 */

	public void doPost(HttpServletRequest request, HttpServletResponse response)

			throws ServletException, IOException {

		//1 中文处理

		request.setCharacterEncoding("utf-8");

		response.setContentType("text/html;charset=utf-8");

		//2 获取op参数

		String op = request.getParameter("op");

		//3 根据op调用具体方法

		if("findall".equals(op))

		{

			findAll(request,response);

		}

		else if("findbydepid".equals(op))

		{

			findByDeptId(request,response);

		}

	}

	//根据部门编号，获取对应的员工

	private void findByDeptId(HttpServletRequest request,

			HttpServletResponse response)

	throws ServletException, IOException

	{

		//1 读取部门 编号

		int deptid = Integer.parseInt(request.getParameter("deptid"));

		//思路，构造<option></option>作为下拉的子html进行返回

		String html = "";

		//调用模型，完成查询

		List<Emp> list = new EmpDao().findByDeptid(deptid);

		for(Emp e:list)

		{

			html += "<option value='"+e.getEid()+"'>"

			+e.getEname()+"</option>";

		}

		PrintWriter out = response.getWriter();

		out.print(html);

		out.flush();

		out.close();

	}

	//用于处理ajax请求，查找所有的部门

	private void findAll(HttpServletRequest request,

			HttpServletResponse response)

	throws ServletException, IOException

	{

		//思路，构造<option></option>作为下拉的子html进行返回

		String html = "";

		List<Dept> list = new DeptDao().findAll();

		for(Dept d:list)

		{

			html += "<option value='"+d.getDepid()+"'>"

			+d.getDepname()+"</option>";

		}

		PrintWriter out = response.getWriter();

		out.print(html);

		out.flush();

		out.close();

	}

	/**

	 * Initialization of the servlet. <br>

	 *

	 * @throws ServletException if an error occurs

	 */

	public void init() throws ServletException {

		// Put your code here

	}

}

public class Emp

{

	private int eid;

	private String ename;

	private Dept dept;//该员工对应的部门

	public int getEid() {

		return eid;

	}

	public void setEid(int eid) {

		this.eid = eid;

	}

	public String getEname() {

		return ename;

	}

	public void setEname(String ename) {

		this.ename = ename;

	}

	public Dept getDept() {

		return dept;

	}

	public void setDept(Dept dept) {

		this.dept = dept;

	}

	public Emp(int eid, String ename, Dept dept) {

		super();

		this.eid = eid;

		this.ename = ename;

		this.dept = dept;

	}

}

import java.util.ArrayList;

import java.util.List;

public class EmpDao {

	private static List<Emp> list = new ArrayList<Emp>();

	static

	{

		try {

			Class.forName("DeptDao");

		} catch (ClassNotFoundException e) {

			// TODO Auto-generated catch block

			e.printStackTrace();

		}

		list.add(new Emp(1, "张3", DeptDao.list.get(0)));

		list.add(new Emp(2, "张4", DeptDao.list.get(1)));

		list.add(new Emp(3, "张5", DeptDao.list.get(2)));

		list.add(new Emp(4, "张6", DeptDao.list.get(3)));

		list.add(new Emp(5, "张7", DeptDao.list.get(0)));

		list.add(new Emp(6, "张8", DeptDao.list.get(1)));

		list.add(new Emp(7, "张9", DeptDao.list.get(2)));

		list.add(new Emp(8, "张10", DeptDao.list.get(3)));

	}

	//给定部门编号，找出该部门对应的所有的员工

	public List<Emp> findByDeptid(int depid)

	{

		List<Emp> result = new ArrayList<Emp>();

		for(Emp e:list)

		{

			if(e.getDept().getDepid()==depid)

			{

				result.add(e);

			}

		}

		return result;

	}

}

public class Dept

{

	private int depid; //部门编号

	private String depname; //部门名

	public int getDepid() {

		return depid;

	}

	public void setDepid(int depid) {

		this.depid = depid;

	}

	public String getDepname() {

		return depname;

	}

	public void setDepname(String depname) {

		this.depname = depname;

	}

	public Dept(int depid, String depname) {

		super();

		this.depid = depid;

		this.depname = depname;

	}

}

import java.util.ArrayList;

import java.util.List;

public class DeptDao

{

	public static List<Dept> list = new ArrayList<Dept>();

	static

	{

		list.add(new Dept(1,"软件部"));

		list.add(new Dept(2,"商务部"));

		list.add(new Dept(3,"行政部"));

		list.add(new Dept(4,"咨询部"));

	}

	//查找所有的部门

	public List<Dept>  findAll()

	{

		return list;

	}

}

下拉列表---demo---bai的更多相关文章

AngularJS 下拉列表demo
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script sr ...
vue1 get,post交互及百度下拉列表demo
用NPOI导出Excel，生成下拉列表、以及下拉联动列表（第1篇/共3篇）
最近帅帅的小毛驴遇到一个很奇葩的需求: 导出Excel报表,而且还要带下拉框,更奇葩的是,下拉框还是联动的. 小毛驴一天比较忙,所以这等小事自然由我来为她分忧了.经历了两天,做了几种解决方案,最后完美 ...
如何在select下拉列表中添加复选框?
近来在给一个公司做考试系统的项目,遇到的问题不少,但其中的几个让我对表单的使用颇为感兴趣,前端程序员都知道,下拉列表有select标签,复选框有checkbox,但是两者合在一起却少有人去研究,当时接 ...
用backbone实现的一个MVC的小demo
一.Apache配置本实例需要使用php支持.要现在Apache中配置虚拟目录,在Apache下的httpd-vhosts.conf文件中添加如下代码 <VirtualHost *:80> ...
JS弹出模态窗口下拉列表特效
效果体验:http://hovertree.com/texiao/js/20/ 或者扫描二维码在手机体验: 点击选择城市后,在弹出的层中的输入框,输入英文字母 h,会有HoverTree和Hewenq ...
jquery选择器demo
大部分选择器都是基于下面这个简单的页面: <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
无废话ExtJs 入门教程十五[员工信息表Demo：AddUser]
无废话ExtJs 入门教程十五[员工信息表Demo:AddUser] extjs技术交流,欢迎加群(201926085) 前面我们共介绍过10种表单组件,这些组件是我们在开发过程中最经常用到的,所以一 ...
无废话ExtJs 入门教程十二[下拉列表联动：Combobox_Two]
无废话ExtJs 入门教程十二[下拉列表联动:Combobox_Two] extjs技术交流,欢迎加群(201926085) 不管是几级下拉列表的联动实现本质上都是根据某个下拉列表的变化,去动态加载其 ...
jQuery ui autocomplete下拉列表样式失效解决，三种获取数据源方式,
jQuery有很多很多的已经实现,很漂亮的插件,autocomplete就是其中之一.jQuery ui autocomplete主要支持字符串Array.JSON两种数据格式,jQuery ui b ...

随机推荐

Oracle数据库类型总结
RACLE基本数据类型(亦叫内置数据类型 built-in datatypes)可以按类型分为:字符串类型.数字类型.日期类型.LOB类型.LONG RAW& RAW类型.ROWID & ...
json对象与字符串互转方法
字符串转json对象: var data = eval( '(' + str + ')' ); json对象转字符串: var jsonStr = JSON.stringify( obj );
svn working copy locked的解决方法
在使用svn更新或提交代码时,会报"svn working copy XXX locked"的错误,利用svn客户端工具TortoiseSVN的cleanup也不能解决问题. 我们 ...
HDFS请求接口
通过HTTP来访问HDFS有两种方法:直接访问,HDFS后台进程直接服务于来自客户端的请求:通过代理(一对多)访问,客户端通常使用DistributedFileSystemAPI访问HDFS.第一种情 ...
Java之File文件类
package IoDemo; import java.io.File; import java.io.FileFilter; import java.io.IOException; import j ...
java项目里的DAO，model，service, IMPL含义
在一般工程中基本上都会出现上述的字眼首先 DAO 提供了应用程序与数据库之间的操作规范和操作用于通常数据库的增删查改一般如果使用框架都是由框架自动生成,提高访问效率和便于快速开发.hiber ...
mysql数据库优化课程---3、数据库设计是什么
mysql数据库优化课程---3.数据库设计是什么一.总结一句话总结: 就是设计各个字段及各个字段类型 1.char,varchar,text同存'ABC'的存储空间为多少? char(255): ...
解决 Firefox 火狐浏览器下载 .exe 文件卡住的问题以及关闭测试版cache2
解决 Firefox 火狐浏览器下载 .exe 文件卡住的问题在firefox浏览器地址栏里输入:about:config 点“我保证会小心”,显示firefox的高级配置列表在配置页面的搜索框里 ...
nyojb 2357
http://acm.nyist.me/JudgeOnline/problem.php?id=2357 2357: 插塔憋憋乐时间限制: 1 Sec 内存限制: 128 MB提交: 50 解决: ...
【WCF】利用WCF实现上传下载文件服务
引言前段时间,用WCF做了一个小项目,其中涉及到文件的上传下载.出于复习巩固的目的,今天简单梳理了一下,整理出来,下面展示如何一步步实现一个上传下载的WCF服务. 服务端 1.首先新建一个名 ...

下拉列表---demo---bai

下拉列表---demo---bai的更多相关文章

随机推荐

热门专题