Servlet单表CRUD
-
使用Servlet完成对单表的CRUD(B/S结构)
-
实现步骤
-
第一步:准备一张数据库表
-
CREATE TABLE `dept` ( deptno int primary key, dname varchar(255), loc varchar(255) ); insert into dept(deptno,dname,loc) values(10,"销售部","天津"), (20,"研发部","北京"), (30,"美术部","南京"), (40,"管理队","上海");
-
-
第二步:准备一套HTML页面(项目原型)
-
将HTML页面中的链接跑通
-
设置哪些页面?(这些页面并不是最原始的,是后面写类的时候修改过的)
-
欢迎页面 index.html
-
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>欢迎使用OA系统</title> </head> <body> <a href="/oa/dpet/list">查看部门列表</a> </body> </html>
-
-
列表页面 list.html (主页面,内置删除,增添,修改,查询)(因为仅使用servlet所以html页面要放在servlet中以字符串的方式传给浏览器)
-
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>部门列表页面</title> </head> <body> <script type="text/javascript"> function del(deptno){ if(window.confirm("删除不可恢复!")){ document.location.href = '"+contextPath+"/dept/delete?deptno=' + deptno; } } </script> <h1 align="center">部门列表</h1><hr> <table border="1pax" align="center" width="50%"> <tr> <th>序号</th> <th>部门编号</th> <th>部门名称</th> <th>操作</th> </tr> <!--以上部分是静态的--> <!-- 以下这部分要根据数据库表中的数据动态的变化--> ------------------------------------------------------------------------------------------- <tr> <th>"+(++i)+"</th> <th>"+deptno+"</th> <th>"+dname+"</th> <th> <a href='javascript:void(0)' onclick='del("+deptno+")'>删除</a> <a href='"+contextPath+"/dept/edit?deptno="+deptno+"'>修改</a> <a href='"+contextPath+"/dept/detail?deptno="+deptno+"'>详情</a> </th> </tr> </table>> ---------------------------------------------------------------------------------------- <hr> <a href='"+contextPath+"/add.html'>添加部门</a> </body> </html>
-
-
新增页面 add.html
-
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>新增部门</title> </head> <body> <h1>新增部门</h1> <hr > <form action="/oa/dept/add" method="post"> 部门编号<input type="text" name="deptno"/><br> 部门名称<input type="text" name="dname"/><br> 部门位置<input type="text" name="loc"/><br> <input type="submit" value="保存"/><br> </form> </body> </html>
-
-
修改页面 edit.html
-
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>修改部门</title> </head> <body> <h1>修改部门</h1> <hr > <form action="/oa/dept/del" method="post"> 部门编号<input type="text" name="deptno" value=""+deptno+""/><br> 部门名称<input type="text" name="dname" value=""+dname+""/><br> 部门位置<input type="text" name="loc" value=""+loc+""/><br> <input type="submit" value="保存"/><br> </form> </body> </html>
-
-
查询页面 detail.html
-
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <title>部门详情页面</title> </head> <body> <h1>部门详情</h1><hr> <br> 部门编号: "+deptno+" <br> 部门名称: "+dname+" <br> 部门位置: "+loc+" <br> <input type='button' value='后退' onclick='window.history.back()' />"); </body> </html>
-
-
-
-
第三步:分析这个系统包含哪些功能?(一个功能对应一个servlet)
- 什么叫一个功能?
- 只要这个操作连接了数据库,就表示一个独立的功能。
- 包括那些功能?
- 1.查看部门列表
- 2.新增部门
- 3.查询部门详情
- 4.删除部门
- 5.修改部门
- 什么叫一个功能?
-
第四步:在IDEA中搭建开发环境
- 创建webapp(给这个webapp添加servlet-api.jar和jsp-api.jar)
- 向Webapp中添加连接数据库驱动jar包(JDBC)
- 在WEB-INF目录下新建lib目录,将jar包引进
- JDBC工具类
- 将准备好的html页面拷贝到idea中
-
实现功能
-
1.查看部门列表
-
第一步:修改前端页面的超链接,用户先点击的就是这个超链接
-
<a href="/oa/dpet/list">查看部门列表</a>
-
-
第二步:编写web.xml配置文件
-
<servlet> <servlet-name>list</servlet-name> <servlet-class>com.servlet.DeptListServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>list</servlet-name> <url-pattern>/dept/list</url-pattern> </servlet-mapping>
-
-
第三步:编写DeptListServlet继承HttpServlet
-
public class DeptListServlet extends HttpServlet { @Override protected void get(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { }
-
-
第四步:在doGet方法中连接数据库,动态获取部门列表信息
-
将list.html中所有的双引号换成单引号,因为out.print(""),这里有一个双引号容易冲突,使用Response将out输出的html字符串响应在浏览器上
-
Connection coon = null; PreparedStatement ps = null; ResultSet rs = null; try { //获取数据库链接 coon = DBUtil.getConnection(); //获取预编译数据库操作对象 String sql = "select deptno,dname,loc from dept"; ps = coon.prepareStatement(sql); //处理查询结果集 rs = ps.executeQuery(); //遍历输出 int i = 0; while (rs.next()){ String deptno = rs.getString("deptno"); String dname = rs.getString("dname"); String loc = rs.getString("loc"); //这部分是动态的 out.print(" <tr>"); out.print(" <th>"+(++i)+"</th>"); out.print(" <th>"+deptno+"</th>"); out.print(" <th>"+dname+"</th>"); out.print(" <th>"); out.print(" <a href='javascript:void(0)' onclick='del("+deptno+")'>删除</a>"); out.print(" <a href='"+contextPath+"/dept/edit?deptno="+deptno+"'>修改</a>"); out.print(" <a href='"+contextPath+"/dept/detail?deptno="+deptno+"'>详情</a>"); out.print(" </th>"); out.print(" </tr>"); } } catch (SQLException e) { e.printStackTrace(); }finally { //释放资源 DBUtil.close(coon,ps,rs); }
-
-
-
第二步:查看部门详情功能
-
找到这个详情是在list里面所以要将其变为一个servlet资源路径(这里可以在urI里面拼接deptno的值),这里很巧妙把要不知道在Deatil中获取的deptno封装在了request请求中使得后续可以十分方便的动态查询到需要的部门详情信息
<a href='/oa/dept/detail?deptno="+deptno+"'>详情</a>
-
创建servlet,配置web.xml,开始编写程序
-
<servlet> <servlet-name>detail</servlet-name> <servlet-class>com.servlet.DeptDetialServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>detail</servlet-name> <url-pattern>/dept/detail</url-pattern> </servlet-mapping>
-
-
开始编写ServletDetail类的实现
-
根据超链接拼接的deptno查询数据库中对应的dname,loc
public class DeptDetialServlet extends HttpServlet { @Override protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=utf-8"); PrintWriter out = response.getWriter(); //打印这个html页面 out.print("<!DOCTYPE html>"); out.print("<html>"); out.print(" <head>"); out.print(" <meta charset='utf-8'>"); out.print(" <title>部门详情页面</title>"); out.print(" </head>"); out.print(" <body>"); out.print(" <h1>部门详情</h1>"); out.print(" <hr>"); out.print("<br>"); //连接数据库查询 Connection coon = null; PreparedStatement ps = null; ResultSet rs = null; try { String deptno = request.getParameter("deptno"); //获取数据库链接 coon = DBUtil.getConnection(); //获取预编译数据库操作对象 String sql = "select deptno,dname,loc from dept where deptno = ?"; ps = coon.prepareStatement(sql); ps.setString(1,deptno); //处理查询结果集 rs = ps.executeQuery(); if(rs.next()){ String dname = rs.getString("dname"); String loc = rs.getString("loc"); out.print("部门编号: "+deptno+" <br>"); out.print("部门名称: "+dname+" <br>"); out.print("部门位置: "+loc+" <br>"); } } catch (SQLException e) { e.printStackTrace(); }finally { //释放资源 DBUtil.close(coon,ps,rs); } out.print("<input type='button' value='后退' onclick='window.history.back()' />"); out.print(" </body>"); out.print("</html>"); } }
-
-
-
第三步:编写部门删除功能
-
1.超链接跳转到删除的servlet
-
配置xml文件
-
<servlet> <servlet-name>delete</servlet-name> <servlet-class>com.servlet.DeptDelServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>delete</servlet-name> <url-pattern>/dept/delete</url-pattern> </servlet-mapping>
-
-
//在list页面点击删除的超链接设置一个弹窗提示 <a href='javascript:void(0)' onclick='del("+deptno+")'>删除</a> //Script脚本 <script type='text/javascript'> function del(deptno){ if(window.confirm('删除不可恢复!'){ //这里跳转到删除的servlet页面,并将要删除的deptno传进去 document.location.href = '"+contextPath+"/dept/delete?deptno=' + deptno } } </script>
//在DelServlet中获取部门编号 String deptno = request.getParameter("deptno"); //连接数据库进行删除 coon = DBUtil.getConnection(); coon.setAutoCommit(false); //获取预编译的操作对象 String sql = "delete from dept where deptno = ?"; ps = coon.prepareStatement(sql); ps.setString(1,deptno); //执行sql count = ps.executeUpdate(); coon.commit(); //删除成功跳转到该页面 if(count == 1){ request.getRequestDispatcher("/dpet/list").forward(request,response); }
-
-
第四步:编写部门增添功能
-
配置xml文件
<servlet> <servlet-name>add</servlet-name> <servlet-class>com.servlet.DeptAddServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>add</servlet-name> <url-pattern>/dept/add</url-pattern> </servlet-mapping>
-
//在list页面编写超链接跳转到add.html String contextPath = request.getContextPath(); <a href='"+contextPath+"/add.html'>添加部门</a> //add.html提交post表单到AddServlet <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>新增部门</title> </head> <body> <h1>新增部门</h1> <hr > <form action="/oa/dept/add" method="post"> 部门编号<input type="text" name="deptno"/><br> 部门名称<input type="text" name="dname"/><br> 部门位置<input type="text" name="loc"/><br> <input type="submit" value="保存"/><br> </form> </body> </html> //AddServlet连接数据库,插入字段 request.setCharacterEncoding("utf-8"); String deptno = request.getParameter("deptno"); String dname = request.getParameter("dname"); String loc = request.getParameter("loc"); int count = 0; Connection coon = null; PreparedStatement ps = null; coon = DBUtil.getConnection(); //获取数据库操作对象 String sql = "insert into dept(deptno,dname,loc) values (?,?,?)"; ps = coon.prepareStatement(sql); ps.setString(1,deptno); ps.setString(2,dname); ps.setString(3,loc); //执行sql count = ps.executeUpdate(); //插入成功,跳转到list页面 if(count ==1 ){ request.getRequestDispatcher("/dpet/list").forward(request,response); }else{ request.getRequestDispatcher("error.html").forward(request,response); }
-
第五步:编写部门修改功能
-
点击list修改按钮之后,跳转到修改页面,页面上应该有原先的deptno,dname,loc等内容,这跟detail的功能是一样的,然后在这个,将这部分内容放在post表单中点击提交,跳转到doPost在doPost中连接数据库进行修改操作
-
编写xml文件
-
<servlet> <servlet-name>edit</servlet-name> <servlet-class>com.servlet.DeptEditServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>edit</servlet-name> <url-pattern>/dept/edit</url-pattern>
-
//两个超链接要配置好 //这个超链接跳转到EditServlet中的doGet里获取到deptno,查询出来的结果放在post表单中 <a href='"+contextPath+"/dept/edit?deptno="+deptno+"'>修改</a> //这个超链接跳转到EditServlet中的doPost <form action="/oa/dept/edit" method="post"> 部门编号<input type="text" name="deptno" value=""+deptno+""/><br> 部门名称<input type="text" name="dname" value=""+dname+""/><br> 部门位置<input type="text" name="loc" value=""+loc+""/><br> <input type="submit" value="保存"/><br> </form>
-
-
编写DeptEditServlet类
-
//doGet类 用户点击修改按钮后根据deptno查询出的数据放在post表单中 protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String contextPath = request.getContextPath(); response.setContentType("text/html;charset=utf-8"); PrintWriter out = response.getWriter(); out.printf("<!DOCTYPE html>"); out.printf("<html>"); out.printf("<head>"); out.printf("<meta charset='utf-8'>"); out.printf("<title>修改部门</title>"); out.printf("</head>"); out.printf("<body>"); out.printf("<h1>修改部门</h1>"); out.printf("<hr >"); //获取主键信息 String deptno = request.getParameter("deptno"); Connection coon = null; PreparedStatement ps = null; ResultSet rs = null; try { //连接数据库动态获取要修改的信息 coon = DBUtil.getConnection(); String sql = "select deptno,dname,loc from dept where deptno= ?"; ps = coon.prepareStatement(sql); ps.setString(1,deptno); rs = ps.executeQuery(); if (rs.next()){ String dname = rs.getString("dname"); String loc = rs.getString("loc"); out.printf("<form action='"+contextPath+"/dept/edit' method='post'>"); out.printf("部门编号<input type='text' name='deptno' value='"+deptno+"' readonly/><br>"); out.printf("部门名称<input type='text' name='dname' value='"+dname+"'/><br>"); out.printf("部门位置<input type='text' name='loc' value='"+loc+"'/><br>"); out.printf("<input type='submit' value='修改'/><br>"); out.printf("</form>"); } } catch (SQLException e) { e.printStackTrace(); }finally { DBUtil.close(coon,ps,rs); } //doPost protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { //解决请求体中文乱码 request.setCharacterEncoding("UTF-8"); String deptno = request.getParameter("deptno"); String dname = request.getParameter("dname"); String loc = request.getParameter("loc"); //连接数据库 Connection coon = null; PreparedStatement ps = null; int count = 0; try { coon = DBUtil.getConnection(); String sql = "update dept set dname = ?,loc=? where deptno = ?"; ps = coon.prepareStatement(sql); ps.setString(1,dname); ps.setString(2,loc); ps.setString(3,deptno); count = ps.executeUpdate(); } catch (SQLException e) { e.printStackTrace(); }finally { DBUtil.close(coon,ps,null); } if(count == 1){ //转发 request.getRequestDispatcher("/dpet/list").forward(request,response); }else{ request.getRequestDispatcher("/error.html").forward(request,response); } }
-
-
思路:前端----->后端,根据前端用户点击的操作一步一步完成相应的功能,这里用户在List页面点击修改按钮跳转到
'"+contextPath+"/dept/edit?deptno="+deptno+"' EditServlet中的doGet方法,在doGet方法的post表单(这里的doGet方法涉及到一个查询操作将原来的数据展示在文本框内)中修改数据之后,点击提交再跳转到EditServlet中的doPost方法,doPost根据post表单中的内容获取到数据,连接数据库进行更新操作
-
-
-
-