AJAX实现数据的增删改查操作

【相关文章推荐：ajax视频教程】

本文实例讲述了AJAX实现数据的增删改查操作。分享给大家供大家参考，具体如下：

主页：index.html

nbsp;html>       编号：
 姓名：
 性别：男：女：
 年龄：  15  16  17  18  19  20  21  22  23  24  25 
 身高：
 体重：
  
 
 
  编号：  

登录后复制    编号  姓名  性别  年龄  身高  体重                      
 
 
 编号：   
 
 
 编号：
 姓名：
 性别：男：女：
 年龄：  15  16  17  18  19  20  21  22  23  24  25 
 身高：
 体重：
      /* var x = $(“#queryResult”).html(); for(var i=0; i < 20 ; i++) { x += '

'; } $(“#queryResult”).html(x);*/ function submit() { var pno = $(“#pno”).val(); var name = $(“#name”).val(); var sex = $('input[name=”sex”]:checked').val(); var age = $(“#age”).val(); var height = $(“#height”).val(); var weight = $(“#weight”).val(); var data={ “pno”:pno, “name”:name, “sex”:sex, “age”:age, “height”:height, “weight” : weight } $.ajax({ type : “post”, url : “Hello”, data : data, cache : true, async : true, success: function (data ,textStatus, jqXHR){ if(data.code == 200){ alert(“插入成功了”); }else{ alert(data.message); } }, error:function (XMLHttpRequest, textStatus, errorThrown) { alert(typeof(errorThrown)); } }); } function query() { var pno = $(“#pno_query”).val(); var str = [“编号”,”姓名”,”性别”,”年龄”,”身高”,”体重”]; $.ajax({ type : “post”, url : “HelloQuery”, data : { “pno”: pno }, cache : true, async : true, success: function (data ,textStatus, jqXHR){ //data = $.parseJSON(data); var j = 0; var x = 1; //for(var i=1; i <20; i++) { for(var p in data){//遍历json对象的每个key/value对,p为key console.log(data[p]); if(j == 6) { j = 0; x++; } $("#queryResult tr:eq("+x+") td:eq("+j+")").html(data[p]); console.log(data[p]); j++; } //} }, error:function (XMLHttpRequest, textStatus, errorThrown) { alert(typeof(errorThrown)); } }); } function del() { var pno = $("#pno_del").val(); $.ajax({ type : "post", url : "HelloDelete", data : { "pno": pno }, cache : true, async : true, success: function (data ,textStatus, jqXHR){ if(data.code == 200){ alert("删除成功了"); }else{ alert(data.message); } }, error:function (XMLHttpRequest, textStatus, errorThrown) { alert(typeof(errorThrown)); } }); } function update() { var pno = $("#pno_up").val(); var name = $("#name_up").val(); var sex = $('input[name="sex_up"]:checked').val(); var age = $("#age_up").val(); var height = $("#height_up").val(); var weight = $("#weight_up").val(); var data={ "pno":pno, "name":name, "sex":sex, "age":age, "height":height, "weight" : weight } $.ajax({ type : "post", url : "HelloUpdate", data : data, cache : true, async : true, success: function (data ,textStatus, jqXHR){ if(data.code == 200){ alert("更新成功了"); }else{ alert(data.message); } }, error:function (XMLHttpRequest, textStatus, errorThrown) { alert(typeof(errorThrown)); } }); }

增加的Serlvet：Hello.java

package com.web; import java.io.IOException;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse; import com.mysql.MysqlUtil; /** * Servlet implementation class Hello */@WebServlet("/Hello")public class Hello extends HttpServlet { private static final long serialVersionUID = 1L;      /**   * @see HttpServlet#HttpServlet()   */  public Hello() {    super();    // TODO Auto-generated constructor stub  }  /** * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response) */ protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub response.getWriter().append("Served at: ").append(request.getContextPath()); }  /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  response.setCharacterEncoding("utf-8"); response.setContentType("application/json; charset=utf-8");  String pno = request.getParameter("pno"); String name = request.getParameter("name"); String sex = request.getParameter("sex"); String age = request.getParameter("age"); String height = request.getParameter("height"); String weight = request.getParameter("weight");  String sqlInsert = "INSERT INTO Person (Pno,Pname,Psex,Page,Pheight,Pweight) VALUES('"; sqlInsert += pno +"','"; sqlInsert += name +"','"; sqlInsert += sex +"',"; sqlInsert += age +","; sqlInsert += height +","; sqlInsert += weight +")";  int message = MysqlUtil.add(sqlInsert); String rep = ""; if(message == 1) {  rep = "{"code":200,"message":"成功插入数据库"}"; }else {  rep = "{"code":"999","message":"插入失败了"}"; } response.getWriter().write(rep);   } }

登录后复制

删除的Servlet：HelloDelete.java

package com.web; import java.io.IOException;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse; import com.mysql.MysqlUtil; /** * Servlet implementation class HelloDelete */@WebServlet("/HelloDelete")public class HelloDelete extends HttpServlet { private static final long serialVersionUID = 1L;      /**   * @see HttpServlet#HttpServlet()   */  public HelloDelete() {    super();    // TODO Auto-generated constructor stub  }  /** * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response) */ protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub response.getWriter().append("Served at: ").append(request.getContextPath()); }  /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setCharacterEncoding("utf-8"); response.setContentType("application/json; charset=utf-8");  String pno = request.getParameter("pno");   String sqlDel = "delete from Person where pno="+pno;   int message = MysqlUtil.del(sqlDel); String rep = ""; if(message == 1) {  rep = "{"code":"200","message":"成功删除"}"; }else {  rep = "{"code":"999","message":"删除失败"}"; } response.getWriter().write(rep); } }

登录后复制

更新的Servlet：HelloUpdate.java

package com.web; import java.io.IOException;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse; import com.mysql.MysqlUtil; /** * Servlet implementation class HelloUpdate */@WebServlet("/HelloUpdate")public class HelloUpdate extends HttpServlet { private static final long serialVersionUID = 1L;      /**   * @see HttpServlet#HttpServlet()   */  public HelloUpdate() {    super();    // TODO Auto-generated constructor stub  }  /** * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response) */ protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub response.getWriter().append("Served at: ").append(request.getContextPath()); }  /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setCharacterEncoding("utf-8"); response.setContentType("application/json; charset=utf-8");  String pno = request.getParameter("pno"); String name = request.getParameter("name"); String sex = request.getParameter("sex"); String age = request.getParameter("age"); String height = request.getParameter("height"); String weight = request.getParameter("weight");  String sqlupdate = "update Person set ";// sqlupdate += "Pno='"+ pno +"',"; sqlupdate += "Pname='"+ name +"',"; sqlupdate += "Psex='"+ sex +"',"; sqlupdate += "Page="+ age +","; sqlupdate += "Pheight="+ height +","; sqlupdate += "Pweight="+ weight; sqlupdate += " where Pno='"+pno+"'"; System.out.println(sqlupdate); int message = MysqlUtil.update(sqlupdate); String rep = ""; if(message == 1) {  rep = "{"code":"200","message":"成功插入数据库"}"; }else {  rep = "{"code":"999","message":"插入失败了"}"; } response.getWriter().write(rep);  } }

登录后复制

查询的Servlet：HelloQuery.java

package com.web; import java.io.IOException;import java.util.ArrayList;import java.util.Arrays;import java.util.List;import java.util.Map; import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse; import com.mysql.MysqlUtil; /** * Servlet implementation class HelloQuery */@WebServlet("/HelloQuery")public class HelloQuery extends HttpServlet { private static final long serialVersionUID = 1L;      /**   * @see HttpServlet#HttpServlet()   */  public HelloQuery() {    super();    // TODO Auto-generated constructor stub  }  /** * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response) */ protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub response.getWriter().append("Served at: ").append(request.getContextPath()); }  /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setCharacterEncoding("utf-8"); response.setContentType("application/json; charset=utf-8"); String pno = request.getParameter("pno"); String[] params = {"Pno","Pname","Psex","Page","Pheight","Pweight"}; String sql = "select * from Person where Pno="+pno; String data = "{";  String[] str = {"编号","姓名","性别","年龄","身高","体重"}; List

登录后复制

以上就是AJAX实现数据的增删改查操作的详细内容，更多请关注【创想鸟】其它相关文章！