前端代码:
<!DOCTYPE html>
<html>
<head>
<title>index.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta charset=UTF-8>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<h1>测试下Ajax在Java后台中实现</h1>
请输入要查询的id:<input name="id" id="key" />
<button id="search">查询</button>
<p id="searchResult">查询结果:</p>
<hr/>
<h3>新增学生表单</h3>
学生 id :
<input type="text" id="idlala" /><br/>
学生姓名:<input type="text" id="name" /><br/>
学生学号:<input type="text" id="rollno" /><br/>
学生性别:<input type="text" id="gender" /><br/>
<button id="add">确认</button><br/>
<p id="addResult">更新结果:</p>
<script>
document.getElementById("search").onclick = function(){
var request = new XMLHttpRequest();
request.open("get","servlet/SearchServlet?id="+document.getElementById("key").value);
request.send();
request.onreadystatechange = function(){
if( request.readyState === 4 && request.status === 200 ){
//var data = JSON.parse(request.responseText);
//alert(data)
document.getElementById("searchResult").innerHTML ="查询结果:" +request.responseText;
}else{
document.getElementById("searchResult").innerHTML =request.readyState +"error"+request.status;
}
}
}
document.getElementById("add").onclick = function(){
var request = new XMLHttpRequest();
request.open("post","servlet/AddServlet");
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
var data ="idlala="+document.getElementById("idlala").value
+ "&name="+document.getElementById("name").value
+ "&rollno="+document.getElementById("rollno").value
+ "&gender="+document.getElementById("gender").value;
alert(data);
request.send(data);
request.onreadystatechange = function(){
if(request.status === 200 && request.readyState === 4){
document.getElementById("addResult").innerHTML = request.responseText;
}else{
document.getElementById("addResult").innerHTML = "更新失败!"+request.status;
}
}
}
</script>
</body>
</html>
后台代码(Servlet 实现):
package com.etoak.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.HashMap;
import java.util.Map;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
import com.etoak.dao.StudentDao;
import com.etoak.pojo.Student;
public class SearchServlet extends HttpServlet {
/**
* The doGet method of the servlet. <br>
*
* This method is called when a form has its tag value method equals to get.
*
* @param request the request send by the client to the server
* @param response the response send by the server to the client
* @throws ServletException if an error occurred
* @throws IOException if an error occurred
*/
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/javascript;charset=utf-8");
PrintWriter out = response.getWriter();
int id = Integer.parseInt(request.getParameter("id"));
Student s = StudentDao.queryById(id);
// 转化成json发送出去
//JSONObject jsonobj = new JSONObject();
//jsonobj.put("id", s.getId());
//jsonobj.put("name", s.getName());
//jsonobj.put("gender",s.getGender());
//jsonobj.put("rollno",s.getNumber());
//System.out.println(jsonobj);
out.println(s);
}
}
package com.etoak.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.etoak.dao.StudentDao;
import com.etoak.pojo.Student;
public class AddServlet extends HttpServlet {
/**
* The doPost method of the servlet. <br>
*
* This method is called when a form has its tag value method equals to post.
*
* @param request the request send by the client to the server
* @param response the response send by the server to the client
* @throws ServletException if an error occurred
* @throws IOException if an error occurred
*/
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/plain;charset=utf-8");
PrintWriter out = response.getWriter();
String name = request.getParameter("name");
String rollno = request.getParameter("rollno");
System.out.println(request.getParameter("idlala"));
Integer id = Integer.parseInt(request.getParameter("idlala"));
char gender = request.getParameter("gender").charAt(0);
Student s = new Student(id,name,rollno,gender);
boolean flag = StudentDao.addStudent(s);
if(flag)
out.println("添加成功"+s);
}
}