<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% request.setAttribute("path", request.getContextPath()); %> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Insert title here</title> <script type="text/javascript" src="${path }/js/jquery-3.2.1.min.js"></script> <script type="text/javascript"> $(function(){ $("[name='name']").blur( function(){ //获取文本框输入的内容 var name=$("#name").val(); //2.使用ajax发送用户名 select * from student where name=?如果存在提示用户名被占用 $.ajax({ type:"get",//提交方式 data:{name:name},//查询的参数 url:"${path}/dorm?method=ajaxname",//提交的路径 dataType:"text",//返回的类型 是Text文本 success:function(result){ if(result==0) { $("#msg").html("用户名不可以使用"); }else{ $("#msg").html("用户名可以使用"); } } }) }) }) function getdormid() { var id=$("#id").val(); $.get("${path}/dorm?method=JSONDormList",{id:id},function(data){ var str=""; $.each(data, function(i, obj) { if(obj.remaining_number!=0){ str += "<option value="+obj.id+">" + obj.code + "</option>"; } }); $("#dorm").html(str); }, "json"); } </script> </head> <body> <form action="" method="post"> <table align="center"> <tr align="center"> <td colspan="8"><h2>宿舍管理</h2> <td> </tr> <tr> <td>姓名:</td><td><input type="text" name="name" id="name"><span id="msg"></span></td> </tr> <tr> <td>年龄:</td><td><input type="text" name="age"></td> </tr> <tr> <td>性别:</td><td><input type="radio" name="sex" value="0" checked="checked">男 <input type="radio" name="sex" value="1">女</td> </tr> <tr> <td>地址:</td><td><input type="text" name="address"></td> </tr> <tr> <td>电话:</td><td><input type="tel" name="tel"></td> </tr> <tr> <td>宿舍编号:</td><td> <select name="id" id="id" onchange="getdormid()"> <option value="11">请选择</option> <option value="0">男</option> <option value="1">女</option> </select> <select name="dorm" id="dorm" > <option></option> </select> </tr> <tr><td><input type="submit" value="添加"></td></tr> </table> </form> </body> </html> ---------------------------------------------------------------------------------------- //异步请求 查询 用户名是否存在 private void getStudenName(HttpServletRequest request, HttpServletResponse response) { // 获取参数 String name = request.getParameter("name"); // 调用方法 Student stu = studentService.ajaxname(name); System.out.println(stu); if (stu != null) { // 如果对象不是null的 说明姓名已经占用 try { response.getWriter().print(0); } catch (IOException e) { e.printStackTrace(); } } else { try { response.getWriter().print(1); } catch (IOException e) { e.printStackTrace(); } } } ---------------------------------------------------------------------------------------- // 查询宿舍集合 传入id 二级联动 private void getJSONDormList(HttpServletRequest request, HttpServletResponse response) { //调用方法 String id= request.getParameter("id"); List<Dorms> dormList=studentService.getJSONDormList(id); System.out.println(dormList.size()+"成都"); Object jsonList = JSON.toJSON(dormList); PrintWriter out; try { out = response.getWriter(); out.print(jsonList); } catch (Exception e) { e.printStackTrace(); } }