ajax的post请求后台数据的简单应用
首先,先在Java里创建你的实体类-JavaBean
在这里插入代码片
package com.entity;
public class Admin {
private int id;
private String name;
private String real_name;
private String password;
private String dapartment;
private String remarks;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getReal_name() {
return real_name;
}
public void setReal_name(String real_name) {
this.real_name = real_name;
}
public String getDapartment() {
return dapartment;
}
public void setDapartment(String dapartment) {
this.dapartment = dapartment;
}
public String getRemarks() {
return remarks;
}
public void setRemarks(String remarks) {
this.remarks = remarks;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
@Override
public String toString() {
return "{" +
"\"id\":\""+id+'\"'+
",\"name\":\""+name+'\"'+
", \"real_name\":\""+real_name+'\"'+
",\"password\":\""+password+'\"'+
", \"dapartment\":\""+dapartment+'\"'+
", \"remarks\":\""+remarks+'\"'+'}';
}
}
注意这里的toString()方法,不要写错,这里写错了很容易造成前后台数据交互不成功
然后再创建我们的servlet控制器,
写一个简单的控制业务的判断方法,注意你的 urlPatterns
给刚刚的实体类对象admin赋予数据 这里我们假装给它把数据set出来
private void select(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {
Admin admin=new Admin();
admin.setId(1);
admin.setName("张三");
admin.setPassword("123456");
admin.setReal_name("张三丰");
admin.setDapartment("管理部");
admin.setRemarks("我是一个管理者"); //依次简单赋值,你也可以从数据库取值
response.getWriter().write(admin.toString()); //把admin对象数据以json的格式响应到后台
}
}
到这里已经可以把数据传输到前台了,就看你怎么接收了,
记住我们的路径是 :admin.do?action=select
开始编写jsp来接收
这是test.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<% pageContext.setAttribute("path", request.getContextPath());
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script src="../js/jquery-2.2.0.min.js"></script>
<base href="<%=basePath%>">
<title>My JSP 'Test.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 type="text/javascript">
function ajaxFun(){
$.ajax({
type: "post", //传数据的方式
url: "${path}/admin.do?action=select", // path是c标签在前面转发的根路径 用来寻找servlet地址 //data: { first2: first, second2:second }, //传的数据 form表单 里面的数据
success: function(admin){
var A = eval("("+admin+")"); //传数据成功之后的操作 admin是servlet传过来的数据 这个函数对admin进行处理,让它显示在 输入框中
$("#id").val(A.id);
$("#name").val(A.name);
$("#real_name").val(A.real_name);
$("#password").val(A.password);
$("#dapartment").val(A.dapartment);
$("#remarks").val(A.remarks); //分别找到对应的输入框 并且将result的值 传进去
}
});
}
</script>
<body>
<H1 align="center">Ajax简单应用</H1>
<div align="center">
<form id="form">
<button type="button" onclick="ajaxFun()">触发按钮</button>
</form>
<input type="text" id="id">
<input type="text" id="name">
<input type="text" id="real_name">
<input type="text" id="password">
<input type="text" id="dapartment">
<input type="text" id="remarks"> // 分别用来接收ajax传到前台的数组
</div>
</body>
</html>
点击按钮后即可触发js来获取后台的数据,至于触发的形式和接收的组件就由你自己定义了!