ajax 异步请求 代码

<%@ 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();
        }
    }

 

 

posted @ 2019-03-04 20:31  lilixia  阅读(6366)  评论(0编辑  收藏  举报