Ajax请求数据与删除数据后刷新页面

1.ajax异步请求数据后填入模态框

请求数据的按钮（HTML）

<a class="queryA" href="javascript:void(0)"   onclick="query(${register.id})"> <span class="glyphicon glyphicon-search"></span></a>

 ajax异步请求数据后给id为queryInfo的模态框赋值并弹出模态框（JS）

//查询单个
function query(id) {
    $.ajax({
        url : "/small/productServlet",
        async : true,
        type : "POST",
        data : {
            "type" : "query",
            "id" : id
        },
        // 成功后开启模态框
        success : showQuery,
        error : function() {
            alert("请求失败");
        },
        dataType : "json"
    });
}

// 查询成功后向模态框插入数据并开启模态框。data是返回的JSON对象
function showQuery(data) {
    $("#name1").val(data.name);
    $("#xinghao1").val(data.xinghao);
    $("#address1").val(data.address);
    $("#department1").val(data.department);
    $("#unit1").val(data.unit);
    $("#number1").val(data.number);
    $("#price1").val(data.price);
    $("#totalprice1").val(data.totalprice);
    $("#come1").val(data.come);
    $("#buytime1").val(data.buytime);
    $("#useperson1").val(data.useperson);
    $("#handleperson1").val(data.handleperson);
    $("#admini1").val(data.admini);
    // 显示模态框
    $('#queryInfo').modal('show');
}

 

后台处理ajax请求并返回JSON串（Java）

protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        RegisterService service = new RegisterServiceImpl();
        request.setCharacterEncoding("UTF-8");
        response.setCharacterEncoding("UTF-8");
        response.setContentType("text/html; charset=UTF-8");
        String type = request.getParameter("type");
        if (type != null && "add".equals(type)) {
            try {
                this.add(request, response, service);
            } catch (Exception e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
        }
        
        if (type != null && "query".equals(type)) {
            try {
                this.query(request, response, service);
            } catch (Exception e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
        }
    }

    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doGet(request, response);
    }


    public void query(HttpServletRequest request, HttpServletResponse response, RegisterService service)
            throws Exception {
        Integer id = Integer.parseInt(request.getParameter("id"));
        Register register = service.getRegisterById(id);
        Gson gson = new Gson();
        String json = gson.toJson(register);
        System.out.println(json);
        response.getWriter().write(json);
    }

 

 JSON串:

{"id":16,"name":"测试名称16","address":"测试地址2","department":"测试部门2","unit":"测试单位2","number":1,"price":1.5,"totalprice":1.5,"come":"来源2","buytime":"八月 23, 2017","useperson":"使用人2","handleperson":"经办人2","admini":"管理员部门2"}

 

 

 

2.ajax异步请求删除数据后刷新页面

 请求删除的按钮(HTML)

<a class="" href="javascript:void(0)" onclick="deleteInfo(${register.id})"> <span  class="glyphicon glyphicon-trash"></a>

 

 Ajax请求删除数据后刷新页面(JS)

// ajax异步删除后刷新页面
function deleteInfo(id) {
    alert("dele");
    $.ajax({
        url : "/small/productServlet",
        async : true,
        type : "POST",
        data : {
            "type" : "delete",
            "id" : id
        },
        success : function(data) {
            alert(data);
            // 删除成功后刷新页面
            window.location.reload();
        },
        error : function() {
            alert("请求失败");
        },
        dataType : "text"
    });
}

 

 后台处理删除的ajax请求(Java)

    // 根据id删除
    public void delete(HttpServletRequest request, HttpServletResponse response, RegisterService service)
            throws Exception {
        Integer id = Integer.valueOf(request.getParameter("id"));
        boolean result = service.deleteRegisterById(id);
        if (result) {
            response.getWriter().write("success delete!");
        }
    }