前言

　　　前段時(shí)間在博客園上找了一個(gè)springmvc的例子，照著學(xué)了一下，算是對(duì)springmvc有了一個(gè)初步的了解，打一個(gè)基礎(chǔ)，下面是鏈接。（我只看了博客，視頻太耗時(shí)間了）

　　　博客鏈接：http://www.cnblogs.com/bigdataZJ/p/springmvc1.html

　　　視頻鏈接：http://ke.atguigu.com/course/48

　　　老師前幾天讓我練習(xí)一下用ajax做增刪改查，只給了我一張數(shù)據(jù)庫(kù)的表，什么都不多說(shuō)。過(guò)程肯定是十分痛苦，因?yàn)榧夹g(shù)方面只是略知一二，真正做的時(shí)候真的是無(wú)從下手，老師又什么都不告訴你，顧著自己的事，網(wǎng)上各種百度，找學(xué)長(zhǎng)幫忙，但是畢竟學(xué)長(zhǎng)也很忙，所以說(shuō)學(xué)習(xí)真的還是要看自己。不過(guò)，花了整整四天的時(shí)間，終于還是做出來(lái)了，功夫不負(fù)有心人。雖然做的真的是相當(dāng)?shù)膌ow，代碼方面也還有很多不足的地方。

　　　最終效果展示頁(yè)面：

　　　

?

　　準(zhǔn)備工作

　　　打開myecipse2014，打開數(shù)據(jù)庫(kù)服務(wù)，打開navicat，將表導(dǎo)入數(shù)據(jù)庫(kù)......等等，我就不多說(shuō)了。

　　配置

　　　新建maven項(xiàng)目工程

　　　WEB-INF目錄下的web.xml　　

1 <?xml version="1.0" encoding="UTF-8"?> 2 <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 3 xmlns="http://java.sun.com/xml/ns/javaee" 4 xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" 5 id="WebApp_ID" version="2.5"> 6 7 <!-- 配置DispatchcerServlet --> 8 <servlet> 9 <servlet-name>springDispatcherServlet</servlet-name> 10 <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class> 11 <!-- 配置Spring mvc下的配置文件的位置和名稱 --> 12 <init-param> 13 <param-name>contextConfigLocation</param-name> 14 <param-value>classpath:springmvc.xml</param-value> 15 </init-param> 16 <load-on-startup>1</load-on-startup> 17 </servlet> 18 19 <servlet-mapping> 20 <servlet-name>springDispatcherServlet</servlet-name> 21 <url-pattern>/</url-pattern> 22 </servlet-mapping> 23 24 <servlet-mapping> 25 <servlet-name>default</servlet-name> 26 <url-pattern>*.css</url-pattern> 27 </servlet-mapping> 28 29 <servlet-mapping> 30 <servlet-name>default</servlet-name> 31 <url-pattern>*.gif</url-pattern> 32 </servlet-mapping> 33 34 <servlet-mapping> 35 <servlet-name>default</servlet-name> 36 <url-pattern>*.jpg</url-pattern> 37 </servlet-mapping> 38 39 <servlet-mapping> 40 <servlet-name>default</servlet-name> 41 <url-pattern>*.js</url-pattern> 42 </servlet-mapping> 43 44 <servlet-mapping> 45 <servlet-name>default</servlet-name> 46 <url-pattern>*.html</url-pattern> 47 </servlet-mapping> 48 49 <filter> 50 <filter-name>SpringEncodingFilter</filter-name> 51 <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class> 52 <init-param> 53 <param-name>encoding</param-name> 54 <param-value>UTF-8</param-value> 55 </init-param> 56 <init-param> 57 <param-name>forceEncoding</param-name> 58 <param-value>true</param-value> 59 </init-param> 60 </filter> 61 <filter-mapping> 62 <filter-name>SpringEncodingFilter</filter-name> 63 <url-pattern>/*</url-pattern> 64 </filter-mapping> 65 66 </web-app> web.xml

　　　src目錄下的springmvc.xml

1 <?xml version="1.0" encoding="UTF-8"?> 2 <beans xmlns="http://www.springframework.org/schema/beans" 3 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 4 xmlns:context="http://www.springframework.org/schema/context" 5 xmlns:mvc="http://www.springframework.org/schema/mvc" 6 xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd 7 http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.0.xsd 8 http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.0.xsd"> 9 10 <mvc:default-servlet-handler/> 11 <mvc:annotation-driven></mvc:annotation-driven> 12 13 <!-- 配置自動(dòng)掃描的包 --> 14 <context:component-scan base-package="com.jackie.springmvc.*"></context:component-scan> 15 16 <!-- 配置視圖解析器 如何把handler 方法返回值解析為實(shí)際的物理視圖 --> 17 <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver"> 18 <property name = "prefix" value="/WEB-INF/"></property> 19 <property name = "suffix" value = ".jsp"></property> 20 </bean> 21 22 <bean id="messageSource" class="org.springframework.context.support.ResourceBundleMessageSource"> 23 <property name="basename" value="i18n"></property> 24 </bean> 25 26 <!-- 配置SessionLocaleResolver --> 27 <bean id="localeResolver" class="org.springframework.web.servlet.i18n.SessionLocaleResolver"></bean> 28 29 <!-- 配置LocaleChangeInterceptor --> 30 <mvc:interceptors> 31 <bean class="org.springframework.web.servlet.i18n.LocaleChangeInterceptor"></bean> 32 </mvc:interceptors> 33 34 <!-- <mvc:view-controller path="/i18n" view-name="i18n"/> --> 35 <mvc:view-controller path="/i18n2" view-name="i18n2"/> 36 37 </beans> springmvc.xml

　　　WEB-INF目錄下的lib jar包

　　　沒(méi)弄明白博客園能不能傳文件，我把我的jar包截圖發(fā)上來(lái)，不保證所有jar包都是需要的。（我直接復(fù)制的老師某個(gè)項(xiàng)目的lib文件夾）

　　　

　　　

　　　　　　　

　 ? ? ??

　　java代碼

　　　

1 package com.jackie.springmvc.ajax.controller; 2 3 import java.util.HashMap; 4 import java.util.Map; 5 6 import org.springframework.beans.factory.annotation.Autowired; 7 import org.springframework.stereotype.Controller; 8 import org.springframework.web.bind.annotation.RequestMapping; 9 import org.springframework.web.bind.annotation.ResponseBody; 10 11 import com.alibaba.fastjson.JSONArray; 12 import com.jackie.springmvc.ajax.dao.OlderDao; 13 14 @Controller 15 public class OlderController { 16 17 @Autowired 18 private OlderDao olderDao; 19 20 //@CrossOrigin(origins="http://192.168.43.158:8080/TestSpringMVC/older", maxAge=3600) 21 @ResponseBody 22 @RequestMapping("/olders") 23 public Map<String, Object> olders(){ 24 JSONArray dataJson = olderDao.getData("select * from peoplespecialcare"); 25 Map<String, Object> map =new HashMap<String, Object>(); 26 map.put("rows",dataJson); 27 map.put("total", olderDao.count); 28 29 return map; 30 } 31 32 @RequestMapping(value="/older/delete") 33 public String delete(Integer id) { 34 olderDao.getData("delete from peoplespecialcare where id = " + id); 35 36 return "redirect:/ajaxOperation.jsp"; 37 } 38 39 @ResponseBody 40 @RequestMapping("/older/search") 41 public Map<String, Object> search(String peoplename){ 42 JSONArray dataJson = olderDao.getData("select * from peoplespecialcare where peoplename=" + "'" + peoplename + "'"); 43 Map<String, Object> map =new HashMap<String, Object>(); 44 map.put("rows",dataJson); 45 map.put("total", olderDao.count); 46 47 return map; 48 } 49 50 @RequestMapping(value="/older/add") 51 public String add(Integer id, Integer peopleid, String peoplename, Integer servicestatusid, 52 Integer feespecialid, Double chargefee, Integer periodicalid, 53 Double startdate, Double enddate, Integer isfeeflagid, String remark) { 54 String sqlStr = "insert into peoplespecialcare(id, peopleid, peoplename, servicestatusid, feespecialid, chargefee, periodicalid, startdate, enddate, isfeeflagid, remark)values("+id+", "+peopleid+", '"+peoplename+"', "+servicestatusid+", "+feespecialid+", "+chargefee+", "+periodicalid+", "+startdate+", "+enddate+", "+isfeeflagid+", '"+remark+"')"; 55 olderDao.getData(sqlStr); 56 57 return "redirect:/ajaxOperation.jsp"; 58 } 59 60 @RequestMapping(value="/older/update") 61 public String update(Integer id, Integer peopleid, String peoplename, Integer servicestatusid, 62 Integer feespecialid, Double chargefee, Integer periodicalid, 63 Double startdate, Double enddate, Integer isfeeflagid, String remark) { 64 String sqlStr = "update peoplespecialcare set peopleid="+peopleid+", peoplename='"+peoplename+"', servicestatusid="+servicestatusid+", feespecialid="+feespecialid+", chargefee="+chargefee+", periodicalid="+periodicalid+", startdate="+startdate+", enddate="+enddate+", isfeeflagid="+isfeeflagid+", remark='"+remark+"' WHERE id="+id+""; 65 olderDao.getData(sqlStr); 66 67 return "redirect:/ajaxOperation.jsp"; 68 } 69 70 } OlderController package com.jackie.springmvc.ajax.dao;import java.sql.Connection; import java.sql.DriverManager; import java.sql.ResultSet; import java.sql.SQLException; import java.sql.Statement;import org.springframework.stereotype.Repository;import com.alibaba.fastjson.JSONArray; import com.jackie.springmvc.ajax.entities.Older;@Repository public class OlderDao {public int count = 0;public JSONArray getData(String sql) {String driver = "com.mysql.jdbc.Driver";String username = "root";String password = "zhao1110";String url = "jdbc:mysql://localhost:3306/fhsystem?user="+ username + "&password=" + password + "&useUnicode=true&characterEncoding=UTF-8";JSONArray array = new JSONArray();String sql1 = sql.substring(0, 6);try {Class.forName(driver);Connection con = DriverManager.getConnection(url);Statement stet = con.createStatement();if(sql1.equals("select")) {ResultSet rs = stet.executeQuery(sql);while(rs.next()){int id = rs.getInt("id");int peopleid = rs.getInt("peopleid");String peoplename = rs.getString("peoplename");int servicestatusid = rs.getInt("servicestatusid");int feespecialid = rs.getInt("feespecialid");double chargefee = rs.getDouble("chargefee");int periodicalid = rs.getInt("periodicalid");double startdate = rs.getDouble("startdate");double enddate = rs.getDouble("enddate");int isfeeflagid = rs.getInt("isfeeflagid");String remark = rs.getString("remark");double optime = rs.getDouble("optime");int opuserid = rs.getInt("opuserid");String opip = rs.getString("opip");String r1 = rs.getString("r1");String r2 = rs.getString("r2");String r3 = rs.getString("r3");String r4 = rs.getString("r4");String r5 = rs.getString("r5");count = rs.getRow();Older older = new Older(id, peopleid, peoplename, servicestatusid,feespecialid, chargefee, periodicalid, startdate, enddate,isfeeflagid, remark, optime, opuserid, opip, r1, r2, r3, r4, r5);array.add(older);/*System.out.println(" " + id + " " + peopleid + " " + peoplename+ " " + servicestatusid + " " + feespecialid + " " + chargefee+ " " + periodicalid + " " + startdate + " " + enddate+ " " + isfeeflagid + " " + remark + " " + optime+ " " + opuserid + " " + opip + " " + r1 + " " + r2+ " " + r3 + " " + r4); */}//System.out.println("轉(zhuǎn)換JSON數(shù)據(jù)："); //System.out.println(array.toString()); rs.close();stet.close();con.close();} else {stet.executeUpdate(sql);stet.close();con.close();/*sql="insert into peoplespecialcare(id, peopleid, peoplename, servicestatusid,feespecialid, chargefee, periodicalid, startdate, enddate,isfeeflagid)values('"+id+"', '"+peopleid+"', '"+peoplename+"', '"+servicestatusid+"', '"+feespecialid+"', '"+chargefee+"', '"+periodicalid+"', '"+startdate+"', '"+enddate+"', '"+isfeeflagid"')";*/}} catch(java.lang.ClassNotFoundException e) { //加載JDBC錯(cuò)誤,所要用的驅(qū)動(dòng)沒(méi)有找到 System.err.print("ClassNotFoundException"); //其他錯(cuò)誤 System.err.println(e.getMessage()); } catch (SQLException ex) { //顯示數(shù)據(jù)庫(kù)連接錯(cuò)誤或查詢錯(cuò)誤 System.err.println("SQLException: " + ex.getMessage()); } return array;} } OlderDao.java　　 package com.jackie.springmvc.ajax.entities;public class Older {private Integer id;private Integer peopleid;private String peoplename;private Integer servicestatusid;private Integer feespecialid;private double chargefee;private Integer periodicalid;private double startdate;private double enddate;private Integer isfeeflagid;private String remark;private double optime;private Integer opuserid;private String opip;private String r1;private String r2;private String r3;private String r4;private String r5;public Integer getId() {return id;}public void setId(Integer id) {this.id = id;}public Integer getPeopleid() {return peopleid;}public void setPeopleid(Integer peopleid) {this.peopleid = peopleid;}public String getPeoplename() {return peoplename;}public void setPeoplename(String peoplename) {this.peoplename = peoplename;}public Integer getServicestatusid() {return servicestatusid;}public void setServicestatusid(Integer servicestatusid) {this.servicestatusid = servicestatusid;}public Integer getFeespecialid() {return feespecialid;}public void setFeespecialid(Integer feespecialid) {this.feespecialid = feespecialid;}public double getChargefee() {return chargefee;}public void setChargefee(double chargefee) {this.chargefee = chargefee;}public Integer getPeriodicalid() {return periodicalid;}public void setPeriodicalid(Integer periodicalid) {this.periodicalid = periodicalid;}public double getStartdate() {return startdate;}public void setStartdate(double startdate) {this.startdate = startdate;}public double getEnddate() {return enddate;}public void setEnddate(double enddate) {this.enddate = enddate;}public Integer getIsfeeflagid() {return isfeeflagid;}public void setIsfeeflagid(Integer isfeeflagid) {this.isfeeflagid = isfeeflagid;}public String getRemark() {return remark;}public void setRemark(String remark) {this.remark = remark;}public double getOptime() {return optime;}public void setOptime(double optime) {this.optime = optime;}public Integer getOpuserid() {return opuserid;}public void setOpuserid(Integer opuserid) {this.opuserid = opuserid;}public String getOpip() {return opip;}public void setOpip(String opip) {this.opip = opip;}public String getR1() {return r1;}public void setR1(String r1) {this.r1 = r1;}public String getR2() {return r2;}public void setR2(String r2) {this.r2 = r2;}public String getR3() {return r3;}public void setR3(String r3) {this.r3 = r3;}public String getR4() {return r4;}public void setR4(String r4) {this.r4 = r4;}public String getR5() {return r5;}public void setR5(String r5) {this.r5 = r5;}@Overridepublic String toString() {return "Older [id=" + id + ", peopleid=" + peopleid + ", peoplename="+ peoplename + ", servicestatusid=" + servicestatusid + ", feespecialid=" + feespecialid + ", chargefee=" + chargefee + ", periodicalid=" + periodicalid+ ", startdate=" + startdate + ", enddate=" + enddate + ", isfeeflagid=" + isfeeflagid + ", remark=" + remark + ", optime=" + optime + ", opuserid=" + opuserid + ", opip=" + opip + ", r1=" + r1 + ", r2=" + r2 + ", r3=" + r3 + ", r4=" + r4 + ", r5=" + r5 + "]";}public Older(Integer id, Integer peopleid, String peoplename, Integer servicestatusid,Integer feespecialid, double chargefee, Integer periodicalid, double startdate,double enddate, Integer isfeeflagid, String remark, double optime,Integer opuserid, String opip, String r1, String r2,String r3, String r4, String r5) {super();this.id = id;this.peopleid = peopleid;this.peoplename = peoplename;this.servicestatusid = servicestatusid;this.feespecialid = feespecialid;this.chargefee = chargefee;this.periodicalid = periodicalid;this.startdate = startdate;this.enddate = enddate;this.isfeeflagid = isfeeflagid;this.remark = remark;this.optime = optime;this.opuserid = opuserid;this.opip = opip;this.r1 = r1;this.r2 = r2;this.r3 = r3;this.r4 = r4;this.r5 = r5;}} Older.java

　　jsp代碼

　　　WebRoot目錄下的三個(gè)jsp文件

　　　主頁(yè)面：ajaxOperation.jsp

1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 2 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> 3 <%-- <% 4 response.setHeader("Content-Type","video/x-msvideo"); 5 response.setHeader("Content-Disposition", "attachment;filename=aaa.doc"); 6 response.header("content-type:application:json;charset=utf8"); 7 response.header("Access-Control-Allow-Origin:*"); 8 response.header("Access-Control-Allow-Methods:POST,GET,OPTIONS,DELETE"); 9 response.header("Access-Control-Allow-Hefaders:x-requested-with,content-type"); 10 %> --%> 11 <% 12 String path = request.getContextPath(); 13 String basePath = request.getScheme() + "://" 14 + request.getServerName() + ":" + request.getServerPort() 15 + path + "/"; 16 %> 17 18 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 19 <html> 20 <head> 21 <base href="<%=basePath%>"> 22 23 <title>My JSP 'ajaxOperation.jsp' starting page</title> 24 25 <meta http-equiv="pragma" content="no-cache"> 26 <meta http-equiv="cache-control" content="no-cache"> 27 <meta http-equiv="expires" content="0"> 28 <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 29 <meta http-equiv="description" content="This is my page"> 30 <script type="text/javascript" src="jQuery/jquery-3.2.1.js"></script> 31 <script> 32 $(document).ready( 33 function() { 34 $.ajax({ 35 url : "http://192.168.43.158:8080/TestSpringMVC/olders", 36 type : "POST", 37 dataType : "json", 38 success : function(data) { 39 $.each(data.rows, function (index, item) { 40 //循環(huán)獲取數(shù)據(jù) 41 var id = item.id; 42 var peopleid = item.peopleid; 43 var peoplename = item.peoplename; 44 var servicestatusid = item.servicestatusid; 45 var feespecialid = item.feespecialid; 46 var chargefee = item.chargefee; 47 var periodicalid = item.periodicalid; 48 var startdate = item.startdate; 49 var enddate = item.enddate; 50 var isfeeflagid = item.isfeeflagid; 51 var remark = item.remark; 52 $("#peopleTable").html($("#peopleTable").html() + "<tr>" 53 + "<td>"+ id + "</td>"+ "<td>"+ peopleid + "</td>" 54 + "<td>"+ peoplename + "</td>" + "<td>"+ servicestatusid + "</td>" 55 + "<td>"+ feespecialid + "</td>" + "<td>"+ chargefee + "</td>" 56 + "<td>"+ periodicalid + "</td>" + "<td>"+ startdate + "</td>" 57 + "<td>"+ enddate + "</td>" + "<td>"+ isfeeflagid + "</td>" 58 + "<td>"+ remark + "</td>" 59 + "<td>" + "<input type='button' value='刪除' οnclick='Delete("+id+")' />" + "</td>" 60 + "<td>" + "<input type='button' value='修改' οnclick='Update("+id+")' />" + "</td>" 61 + "</tr>"); 62 }); 63 }, 64 error : function() { 65 alert("數(shù)據(jù)訪問(wèn)錯(cuò)誤"); 66 } 67 }); 68 }); 69 70 //顯示全部數(shù)據(jù) 71 function Show() { 72 $("#peopleTable").empty(); 73 $("#peopleTable").html( 74 "<tr>" + 75 "<td>id</td>" + 76 "<td>peopleid</td>" + 77 "<td>peoplename</td>" + 78 "<td>servicestatusid</td>" + 79 "<td>feespecialid</td>" + 80 "<td>chargefee</td>" + 81 "<td>periodicalid</td>" + 82 "<td>startdate</td>" + 83 "<td>enddate</td>" + 84 "<td>isfeeflagid</td>" + 85 "<td>remark</td>" + 86 "<td>刪除</td>" + 87 "<td>修改</td>" + 88 "</tr>"); 89 $.ajax({ 90 url : "http://192.168.43.158:8080/TestSpringMVC/olders", 91 type : "POST", 92 dataType : "json", 93 success : function(data) { 94 $.each(data.rows, function (index, item) { 95 //循環(huán)獲取數(shù)據(jù) 96 var id = item.id; 97 var peopleid = item.peopleid; 98 var peoplename = item.peoplename; 99 var servicestatusid = item.servicestatusid; 100 var feespecialid = item.feespecialid; 101 var chargefee = item.chargefee; 102 var periodicalid = item.periodicalid; 103 var startdate = item.startdate; 104 var enddate = item.enddate; 105 var isfeeflagid = item.isfeeflagid; 106 var remark = item.remark; 107 $("#peopleTable").html($("#peopleTable").html() + "<tr>" 108 + "<td>"+ id + "</td>"+ "<td>"+ peopleid + "</td>" 109 + "<td>"+ peoplename + "</td>" + "<td>"+ servicestatusid + "</td>" 110 + "<td>"+ feespecialid + "</td>" + "<td>"+ chargefee + "</td>" 111 + "<td>"+ periodicalid + "</td>" + "<td>"+ startdate + "</td>" 112 + "<td>"+ enddate + "</td>" + "<td>"+ isfeeflagid + "</td>" 113 + "<td>"+ remark + "</td>" 114 + "<td>" + "<input type='button' value='刪除' οnclick='Delete("+id+")' />" + "</td>" 115 + "<td>" + "<input type='button' value='修改' οnclick='Update("+id+")' />" + "</td>" 116 + "</tr>"); 117 }); 118 }, 119 error : function() { 120 alert("數(shù)據(jù)訪問(wèn)錯(cuò)誤"); 121 } 122 }); 123 } 124 125 //刪除功能 126 function Delete(id) { 127 var oid = id; 128 if(confirm("確定要?jiǎng)h除嗎？")) { 129 $.ajax({ 130 url : "http://192.168.43.158:8080/TestSpringMVC/older/delete", 131 data : { 132 "id":oid 133 }, 134 }); 135 alert("刪除成功"); 136 location.reload(); 137 } 138 } 139 140 //查詢功能 141 function Search() { 142 var opeoplename = $("#searchInput").val(); 143 $.ajax({ 144 url : "http://192.168.43.158:8080/TestSpringMVC/older/search", 145 type : "POST", 146 dataType : "json", 147 data : { 148 "peoplename":opeoplename 149 }, 150 success : function(data) { 151 $("#peopleTable").html( 152 "<tr>" + 153 "<td>id</td>" + 154 "<td>peopleid</td>" + 155 "<td>peoplename</td>" + 156 "<td>servicestatusid</td>" + 157 "<td>feespecialid</td>" + 158 "<td>chargefee</td>" + 159 "<td>periodicalid</td>" + 160 "<td>startdate</td>" + 161 "<td>enddate</td>" + 162 "<td>isfeeflagid</td>" + 163 "<td>remark</td>" + 164 "<td>刪除</td>" + 165 "<td>修改</td>" + 166 "</tr>"); 167 $.each(data.rows, function (index, item) { 168 //循環(huán)獲取數(shù)據(jù) 169 var id = item.id; 170 var peopleid = item.peopleid; 171 var peoplename = item.peoplename; 172 var servicestatusid = item.servicestatusid; 173 var feespecialid = item.feespecialid; 174 var chargefee = item.chargefee; 175 var periodicalid = item.periodicalid; 176 var startdate = item.startdate; 177 var enddate = item.enddate; 178 var isfeeflagid = item.isfeeflagid; 179 var remark = item.remark; 180 $("#peopleTable").html($("#peopleTable").html() + "<tr>" 181 + "<td>"+ id + "</td>"+ "<td>"+ peopleid + "</td>" 182 + "<td>"+ peoplename + "</td>" + "<td>"+ servicestatusid + "</td>" 183 + "<td>"+ feespecialid + "</td>" + "<td>"+ chargefee + "</td>" 184 + "<td>"+ periodicalid + "</td>" + "<td>"+ startdate + "</td>" 185 + "<td>"+ enddate + "</td>" + "<td>"+ isfeeflagid + "</td>" 186 + "<td>"+ remark + "</td>" 187 + "<td>" + "<input type='button' value='刪除' οnclick='Delete("+id+")' />" + "</td>" 188 + "<td>" + "<input type='button' value='修改' οnclick='Update("+id+")' />" + "</td>" 189 + "</tr>"); 190 }); 191 }, 192 error : function() { 193 alert("查詢失敗"); 194 } 195 }); 196 } 197 198 //添加功能 199 function Add() { 200 window.location.href = "http://192.168.43.158:8080/TestSpringMVC/addWindow.jsp"; 201 } 202 203 //修改功能 204 function Update(id) { 205 var oid = id; 206 window.location.href = "http://192.168.43.158:8080/TestSpringMVC/updateWindow.jsp?id="+oid; 207 } 208 </script> 209 </head> 210 211 <body> 212 <br> 213 請(qǐng)輸入所查詢的老人姓名:&nbsp;&nbsp; 214 <input type="text" id="searchInput" value=""/> 215 <input type="button" value="查詢" id="searchButton" οnclick="Search()"/> 216 <input type="button" value="添加老人" id="addButton" οnclick="Add()"/> 217 <input type="button" value="顯示全部數(shù)據(jù)" id="showButton" οnclick="Show()"/> 218 <br><br> 219 <table id="peopleTable" border="1" cellpadding="10" cellspacing="0"> 220 <tr> 221 <td>id</td> 222 <td>peopleid</td> 223 <td>peoplename</td> 224 <td>servicestatusid</td> 225 <td>feespecialid</td> 226 <td>chargefee</td> 227 <td>periodicalid</td> 228 <td>startdate</td> 229 <td>enddate</td> 230 <td>isfeeflagid</td> 231 <td>remark</td> 232 <td>刪除</td> 233 <td>修改</td> 234 </tr> 235 </table> 236 </body> 237 </html> ajaxOperation.jsp

　　　

　　　添加頁(yè)面：addWindow.jsp　　

1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 2 <% 3 String path = request.getContextPath(); 4 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; 5 %> 6 7 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 8 <html> 9 <head> 10 <base href="<%=basePath%>"> 11 12 <title>添加界面</title> 13 14 <meta http-equiv="pragma" content="no-cache"> 15 <meta http-equiv="cache-control" content="no-cache"> 16 <meta http-equiv="expires" content="0"> 17 <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 18 <meta http-equiv="description" content="This is my page"> 19 </head> 20 21 <body> 22 <form action="http://192.168.43.158:8080/TestSpringMVC/older/add" method="POST"> 23 id:<input type="text" name="id"><br> 24 peopleid:<input type="text" name="peopleid"><br> 25 peoplename:<input type="text" name="peoplename"><br> 26 servicestatusid:<input type="text" name="servicestatusid"><br> 27 feespecialid:<input type="text" name="feespecialid"><br> 28 chargefee:<input type="text" name="chargefee"><br> 29 periodicalid:<input type="text" name="periodicalid"><br> 30 startdate:<input type="text" name="startdate"><br> 31 enddate:<input type="text" name="enddate"><br> 32 isfeeflagid:<input type="text" name="isfeeflagid"><br> 33 remark:<input type="text" name="remark"><br> 34 <input type="submit" value="添加"> 35 </form> 36 </body> 37 </html> addWindow.jsp　　　

　　　修改頁(yè)面：updateWindow.jsp

1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 2 <% 3 String path = request.getContextPath(); 4 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; 5 %> 6 7 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 8 <html> 9 <head> 10 <base href="<%=basePath%>"> 11 12 <title>修改界面</title> 13 14 <meta http-equiv="pragma" content="no-cache"> 15 <meta http-equiv="cache-control" content="no-cache"> 16 <meta http-equiv="expires" content="0"> 17 <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 18 <meta http-equiv="description" content="This is my page"> 19 <script type="text/javascript" src="jQuery/jquery-3.2.1.js"></script> 20 </head> 21 22 <body> 23 <form action="http://192.168.43.158:8080/TestSpringMVC/older/update" method="POST"> 24 <input type="hidden" name="id" value="<%=(String)request.getParameter("id") %>"> 25 peopleid:<input type="text" name="peopleid"><br> 26 peoplename:<input type="text" name="peoplename"><br> 27 servicestatusid:<input type="text" name="servicestatusid"><br> 28 feespecialid:<input type="text" name="feespecialid"><br> 29 chargefee:<input type="text" name="chargefee"><br> 30 periodicalid:<input type="text" name="periodicalid"><br> 31 startdate:<input type="text" name="startdate"><br> 32 enddate:<input type="text" name="enddate"><br> 33 isfeeflagid:<input type="text" name="isfeeflagid"><br> 34 remark:<input type="text" name="remark"><br> 35 <input type="submit" value="確認(rèn)修改" /> 36 </form> 37 </body> 38 </html> updateWindow.jsp

　　　

　　　注意！別忘在WebRoot目錄下新建jQuery文件夾，放入jquery.js

　　　

　　另外

　　　當(dāng)時(shí)搗鼓如何連接數(shù)據(jù)庫(kù)的時(shí)候建了個(gè)DB Brower，不知道用沒(méi)用上，有時(shí)間我會(huì)弄明白它。（運(yùn)行程序的時(shí)候，這個(gè)是未打開狀態(tài)。）

　　　

?

　　　填坑：DB Browser類似于Navicat，但是相對(duì)操作要稍麻煩一些，好處是不用根據(jù)表寫javabean了。

?　 查詢功能效果界面

?

　刪除功能效果界面

　　

轉(zhuǎn)載于:https://www.cnblogs.com/overfly/p/7412154.html

創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來(lái)咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)

總結(jié)

以上是生活随笔為你收集整理的基于springmvc、ajax，后台连接数据库的增删改查的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。