web实现增删改查的方式有很多啊,对于初学者来说当然是要先了解各部分的传值的方式.本篇博客从jsp技术的最基础方面进行说明.
一、什么是jsp技术
首先,我们要了解什么是jsp技术.
jsp技术是基于JAVA语言的动态网页技术,通常使用HTML语言来设计和格式化静态页面内容,然后通过jsp标签来实现动态部分,也就是数据间的互交.在这里推荐一篇博客来供初学者进行学习.
二、代码实现
1.创建数据库表
创建一下数据库表,数据库名Student,表名student.
2.创建web项目,项目名为Student并建立以下jsp页面
1)主页面 index.jsp
1 <%@ page language="java" import="java.sql.*" pageEncoding="utf-8"%> 2 <%@ page errorPage="error.jsp"%> 3 <html> 4 <head> 5 <title>学生管理系统</title> 6 <link rel="stylesheet" type="text/css" href="css/style.css"> 7 </head> 8 <body> 9 <div align="center"> 10 <p>学生管理系统</p> 11 <a href="add.jsp">添加学生信息</a> <br /> <br /> 12 <table style=" 50%;"> 13 <tr> 14 <th>学号</th> 15 <th>姓名</th> 16 <th>性别</th> 17 <th>出生日期</th> 18 <th>家庭住址</th> 19 <th>操 作</th> 20 </tr> 21 <% 22 try { 23 Class.forName("com.mysql.jdbc.Driver"); 24 Connection con = DriverManager.getConnection( 25 "jdbc:mysql://localhost:3306/student?useUnicode=true&characterEncoding=utf-8", "root", 26 "root"); 27 //使用Statement对象 28 Statement stmt = con.createStatement(); 29 String s = "select * from student"; 30 ResultSet rs = stmt.executeQuery(s); 31 32 while (rs.next()) { 33 int id = rs.getInt(1); 34 out.println("<tr><td>" + rs.getString(1) + "</td><td>" + rs.getString(2) + "</td><td>" 35 + rs.getString(3) + "</td><td>" + rs.getString(4) + "</td><td>" + rs.getString(5) 36 + "</td><td><a href='edit.jsp?id=" + id 37 + "'>修改</a> <a onclick='check()' href='del.jsp?id=" + id + "'>删除</a></td></tr>"); 38 } 39 rs.close(); 40 stmt.close(); 41 con.close(); 42 } catch (Exception e) { 43 out.println("Exception:" + e.getMessage()); 44 } 45 %> 46 47 </table> 48 <br /> 49 </div> 50 <script> 51 function check() { 52 if (confirm("确认执行此操作吗？")) { 53 return true; 54 } else { 55 return false; 56 } 57 } 58 </script> 59 </body> 60 </html>
这里采用JDBC来连接数据库,并指定字符编码与解码方式为utf-8.并通过遍历表student的数据将每一行的每一列数据依次out.printf输出到table中.设计修改、操作的操作按钮传值id进行相应操作.
其中,script中为javascript脚本语言,用来限制删除的操作,防止用户误删.
2)添加操作
add.jsp
1 <%@ page contentType="text/html; charset=utf-8" import="java.sql.*" 2 errorPage="error.jsp"%> 3 <html> 4 <head> 5 <title>添学生信息</title> 6 <link rel="stylesheet" type="text/css" href="css/style.css"> 7 </head> 8 <body> 9 <div align="center"> 10 <p>添加成员信息</p> 11 <form action="addsave.jsp" method="post"> 12 <table style=" 50%"> 13 <tr> 14 <th width="50%">学号：</th> 15 <td width="50%"><input name="id" type="text" required 16 oninvalid="setCustomValidity('学号是必填项')" 17 oninput="setCustomValidity('')"></td> 18 </tr> 19 <tr> 20 <th>姓名：</th> 21 <td><input name="name" type="text" required 22 oninvalid="setCustomValidity('姓名是必填项')" 23 oninput="setCustomValidity('')"></td> 24 </tr> 25 <tr> 26 <th>性别：</th> 27 <td><select name="sex"> 28 <option value="男">男</option> 29 <option value="女">女</option> 30 </select></td> 31 </tr> 32 <tr> 33 <th>出生日期：</th> 34 <td><input name="birthday" type="text" required 35 oninvalid="setCustomValidity('出生日期是必填项')" 36 oninput="setCustomValidity('')"></td> 37 </tr> 38 <tr> 39 <th>家庭住址：</th> 40 <td><input name="address" type="text" required 41 oninvalid="setCustomValidity('家庭居住地址是必填项')" 42 oninput="setCustomValidity('')"></td> 43 </tr> 44 </table> 45 <button type="submit" name="submit" value="添加">添 加</button> 46 <button type="reset" value="重置">重 置</button> 47 </form> 48 </div> 49 </body> 50 </html>
设计添加页面,通过form表单传值到addsave.jsp
addsave.jsp
addsave.jsp进行数据的获取并将数据添加到数据库.因为传值的时候是以String的形式传输的,所以对于id要进行类型转换 1 int id = Integer.parseInt(request.getParameter("id")); .
1 <%@ page contentType="text/html; charset=utf-8" import="java.sql.*" 2 errorPage="error.jsp"%> 3 <html> 4 <head> 5 <title>添加学生信息</title> 6 <link rel="stylesheet" type="text/css" href="css/style.css"> 7 </head> 8 <body> 9 <% 10 request.setCharacterEncoding("utf-8"); 11 String submit = request.getParameter("submit"); 12 13 int id = Integer.parseInt(request.getParameter("id")); 14 String name = request.getParameter("name"); 15 String sex = request.getParameter("sex"); 16 String birthday = request.getParameter("birthday"); 17 String address = request.getParameter("address"); 18 Class.forName("com.mysql.jdbc.Driver"); 19 Connection con = DriverManager.getConnection( 20 "jdbc:mysql://localhost:3306/student?useUnicode=true&characterEncoding=utf-8", "root", "root"); 21 //使用Statement对象 22 Statement stmt = con.createStatement(); 23 String sql = "insert into student(id,name,sex,birthday,address) values('" + id + "','" + name + "','" + sex 24 + "','" + birthday + "'," + address + ")"; 25 int i = stmt.executeUpdate(sql); 26 27 if (i == 1) { 28 %> 29 30 <script type="text/javascript"> 31 alert("学生信息添加成功"); 32 window.location.href = "index.jsp"; 33 </script> 34 <% 35 } else { 36 %> 37 <script type="text/javascript"> 38 alert("学生信息添加失败"); 39 window.location.href = "index.jsp"; 40 </script> 41 <% 42 } 43 stmt.close(); 44 con.close(); 45 %> 46 </body> 47 </html>
3)修改操作
edit.jsp
1 <%@ page import="java.sql.*" pageEncoding="utf-8" errorPage="error.jsp"%> 2 <html> 3 <head> 4 <title>修改学生信息</title> 5 <link rel="stylesheet" type="text/css" href="css/style.css"> 6 </head> 7 <body> 8 <% 9 request.setCharacterEncoding("utf-8"); 10 Class.forName("com.mysql.jdbc.Driver"); 11 Connection con = DriverManager.getConnection( 12 "jdbc:mysql://localhost:3306/student?useUnicode=true&characterEncoding=utf-8", "root", "20173673"); 13 Statement stmt = con.createStatement(); 14 String id = request.getParameter("id"); 15 ResultSet rs = stmt.executeQuery("select * from student where id=" + id); 16 rs.next(); 17 %> 18 <div align="center"> 19 <form action="editsave.jsp" method="post"> 20 <h2>修改学生信息</h2> 21 <table style=" 50%"> 22 <tr> 23 <th width="50%">学号：</th> 24 <td width="50%"><input name="id" type="text" 25 value="<%=rs.getString(1)%>" disabled="disabled"></td> 26 </tr> 27 <tr> 28 <th>姓名：</th> 29 <td><input name="name" type="text" 30 value="<%=rs.getString(2)%>"></td> 31 </tr> 32 <tr> 33 <th>性别：</th> 34 <td><select name="sex"> 35 <option value="<%=rs.getString(3)%>"><%=rs.getString(3)%> 36 <option value="男">男</option> 37 <option value="女">女</option> 38 </select> 39 </tr> 40 <tr> 41 <th>出生日期：</th> 42 <td><input name="birthday" type="text" 43 value="<%=rs.getString(4)%>"></td> 44 </tr> 45 <tr> 46 <th>家庭住址：</th> 47 <td><input name="address" type="text" 48 value="<%=rs.getString(5)%>"></td> 49 </tr> 50 </table> 51 <input type="hidden" name="id" value="<%=id%>"> 52 <button type="submit" name="submit" value="修改">修 改</button> 53 <button type="reset" value="重置">重 置</button> 54 </form> 55 </div> 56 <% 57 rs.close(); 58 stmt.close(); 59 con.close(); 60 %> 61 62 </body> 63 </html>
通过id获取要修改的内容,显示到table的input输入框中,进行修改.然后将值传输到editsave.jsp中,进行信息修改的操作.
editsave.jsp
1 <%@ page import="java.sql.*" pageEncoding="utf-8" errorPage="error.jsp"%> 2 <html> 3 <head> 4 <title>修改完成</title> 5 <link rel="stylesheet" type="text/css" href="css/style.css"> 6 </head> 7 <body> 8 <% 9 request.setCharacterEncoding("utf-8"); 10 int id = Integer.parseInt(request.getParameter("id")); 11 String name = request.getParameter("name"); 12 String sex = request.getParameter("sex"); 13 String birthday = request.getParameter("birthday"); 14 String address = request.getParameter("address"); 15 Class.forName("com.mysql.jdbc.Driver"); 16 Connection con = DriverManager.getConnection( 17 "jdbc:mysql://localhost:3306/student?useUnicode=true&characterEncoding=utf-8", "root", "root"); 18 Statement stmt = con.createStatement(); 19 String sql = "update student set id = '" + id + "',name='" + name + "',sex = '" + sex + "',birthday='" 20 + birthday + "', address = '" + address + "'where id=" + id; 21 22 int i = stmt.executeUpdate(sql); 23 if (i == 1) { 24 %> 25 26 <script type="text/javascript"> 27 alert("信息修改成功"); 28 window.location.href = "index.jsp"; 29 </script> 30 <% 31 } else { 32 %> 33 <script type="text/javascript"> 34 alert("信息修改失败"); 35 window.location.href = 'edit.jsp?id=' 36 " + id + "; 37 </script> 38 39 <% 40 } 41 stmt.close(); 42 con.close(); 43 %> 44 </body> 45 </html>
4)删除操作
delete.jsp
1 <%@ page contentType="text/html; charset=gbk" language="java" 2 import="java.sql.*" pageEncoding="utf-8"%> 3 <html> 4 <head> 5 <title>删除学生信息</title> 6 <link rel="stylesheet" type="text/css" href="css/style.css"> 7 </head> 8 <body> 9 <% 10 request.setCharacterEncoding("gbk"); 11 Class.forName("com.mysql.jdbc.Driver"); 12 Connection con = DriverManager.getConnection( 13 "jdbc:mysql://localhost:3306/student?useUnicode=true&characterEncoding=utf-8", "root", "root"); 14 Statement stmt = con.createStatement(); 15 String id = request.getParameter("id"); 16 int i = stmt.executeUpdate("delete from student where id=" + id); 17 if (i == 1) { 18 %> 19 <script type="text/javascript"> 20 alert("学生信息删除成功!"); 21 window.location.href = "index.jsp"; 22 </script> 23 <% 24 } else { 25 %> 26 <script type="text/javascript"> 27 alert("学生信息删除失败"); 28 window.location.href = "index.jsp"; 29 </script> 30 <% 31 } 32 con.close(); 33 stmt.close(); 34 %> 35 </body> 36 </html>
三、效果截图
index
add
edit
大体就是这样啦,有什么不对的希望大家多多指正.