zoukankan      html  css  js  c++  java
  • 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();
            }
        }

     

  • 相关阅读:
    L1->排列组合和古典概型
    HIT2019秋计算机网络->传输层一些总结
    HIT2019秋计算机网络->TCP连接3次握手
    HIT2019春软件构造->大文件读写方法NIO
    HIT2019春软件构造->重写hashCode()方法
    HIT2019春软件构造->正则表达式语法
    HIT2019春软件构造->Git&Github学习笔记
    YII2视图间共享数据
    Yii2 选择布局
    Yii2视图 使用$this->context获取当前的Module、Controller(控制器)、Action等
  • 原文地址:https://www.cnblogs.com/JBLi/p/10472953.html
Copyright © 2011-2022 走看看