目录
2.在ManagementController类中,添加访问create.jsp的入口
4.在ManagementController类中,添加接收create.jsp表单提交的方法;
(1)不借助第三方组件,“在服务器端”采用传统的策略处理【设计文件上传的请求】时:是不行的;
(1.1)演示1:如果不设置form表单的编码方式:enctype="multipart/form-data";
(1.2)演示2:设置form表单的编码方式:enctype="multipart/form-data";
结论:通过上面的演示可以知道:不借助第三方组件,“在服务器端”采用传统的策略处理【设计文件上传的请求】时:是不行的;
(2.3)文件上传后,接下来的任务,就是将这个form表单提交过来的数据,新增到存储数据的xml文件中!!!
(3.1)在XmlDataSource工具类中,编写添加的方法
(3.2)在Dao中编写create()方法,向xml中添加数据;
(3.5)最后补充一点:属性中有id(自增,唯一标识对象)属性的时候,javaBean一般不添加有参构造;
0.新增功能需要完成的功能概述:
实现思路:
1.将新增页create.html添加到项目中
create.html外部文件引入: create.html是新增油画的表单页:打开create.html:可以看到这个效果:
将create.html添加到工程中:
<%@page contentType="text/html;charset=utf-8"%>
<!-- 新增油画页面 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>新增油画</title>
<link rel="stylesheet" type="text/css" href="css\create.css">
<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
</head>
<body>
<div class="container">
<fieldset>
<legend>新增油画</legend>
<form action="" method="post"
autocomplete="off">
<ul class="ulform">
<li>
<span>油画名称</span>
<span id="errPname"></span>
<input id="pname" name="pname" />
</li>
<li>
<span>油画类型</span>
<span id="errCategory"></span>
<select id="category" name="category">
<option value="-1">请选择油画类型</option>
<option value="1">现实主义</option>
<option value="2">抽象主义</option>
</select>
</li>
<li>
<span>油画价格</span>
<span id="errPrice"></span>
<input id="price" name="price"/>
</li>
<li>
<span>作品预览</span>
<span id="errPainting"></span>
<input id="painting" name="painting" type="file"
style="padding-left: 0px;" accept="image/*" />
</li>
<li>
<span>详细描述</span>
<span id="errDescription"></span>
<textarea
id="description" name="description"></textarea>
</li>
<li style="text-align: center;">
<button type="submit" class="btn-button">提交表单</button>
</li>
</ul>
</form>
</fieldset>
</div>
</body>
</html>
可以看到,create.jsp里面就是一个form表单;
2.在ManagementController类中,添加访问create.jsp的入口
因为,在工程中,所有JSP对外是不可见的,所以需要在Controller这只一个跳转,作为访问create.jsp的入口;
而在https://blog.csdn.net/csucsgoat/article/details/114897829这篇博客中创建的ManagementController类,ManagementController类需要完成,【增】,【删】,【改】,【查】的操作的;自然新增文件这条业务的Controller部分也是在ManagementController这个类中写的:
package com.imooc.mgallery.controller;
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.imooc.mgallery.service.PaintingService;
import com.imooc.mgallery.utils.PageModel;
/**
* 后台管理功能Controller;
* 后台系统,所需要的增,删,改,查的操作,都在这一个Controller类中完成;
* Servlet implementation class ManagementController
*/
@WebServlet("/management")
public class ManagementController extends HttpServlet {
private static final long serialVersionUID = 1L;
// 创建PaintingService对象;;
// 即无论是前台系统的PaintingController,还是后台系统的ManagementController都调用PaintingService中提供的方法;
private PaintingService paintingService = new PaintingService();
/**
* @see HttpServlet#HttpServlet()
*/
public ManagementController() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 设置请求体中的字符集编码方式;;;
// get请求没有请求体,所以,这个语句是为doPost()方法中执行doGet(request,response)后,跳转过来的post请求来设置的;
// 即这条代码是为doPost()来进行服务的;
request.setCharacterEncoding("UTF-8");
// 设置响应的字符集编码方式
response.setContentType("text/html;charset=utf-8");
String method = request.getParameter("method");
if(method.equals("list")) { // 当前台传入的method参数值为“list”的时候,代表是分页请求,调用定义的list方法;
this.list(request,response); // 然后,将分页处理的代码写在list方法中就可以了;
}else if(method.equals("delete")) { // 当method参数值为“delete”时,表示是删除请求,调用定义的delete方法;
this.delete(request, response);
}else if(method.equals("show_create")) {
// method参数为“show_create”,表示是新增;调用新增的方法,跳转到create.jsp
this.showCreatePage(request, response);
}
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response); // doPost调用了doGet()方法,所以,把逻辑代码都写在doGet方法中就可以了;
}
/**
*
* @param request
* @param response
* @throws IOException
* @throws ServletException
*/
private void list(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String p = request.getParameter("p");
String r = request.getParameter("r");
if(p==null) {
p = "1";
}
if(r==null) {
r = "6";
}
PageModel pageModel = paintingService.pagination(Integer.parseInt(p), Integer.parseInt(r));
request.setAttribute("pageModel", pageModel);
request.getRequestDispatcher("/WEB-INF/jsp/list.jsp").forward(request, response);
}
private void delete(HttpServletRequest request, HttpServletResponse response) {
}
/**
* 这个方法,是一个纯粹的入口;
* @param request
* @param response
* @throws ServletException
* @throws IOException
*/
private void showCreatePage(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.getRequestDispatcher("/WEB-INF/jsp/create.jsp").forward(request, response);
}
}
ManagementController类的几点说明:
(1)首先,如果请求中method参数值为“show_create”时,就调用showCreatePage()方法;
else if(method.equals("show_create")) {
// method参数为“show_create”,表示是新增;调用新增的方法,跳转到create.jsp
this.showCreatePage(request, response);
}
(2)showCreatePage()方法就是将请求转发到create.jsp上去;再次说明,这个方法仅仅为create.jsp提供一个访问入口!!!
private void showCreatePage(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.getRequestDispatcher("/WEB-INF/jsp/create.jsp").forward(request, response);
}
自此:在浏览器中访问: localhost:8080/management?method=show_create时候,就会访问ManagementController类,然后ManagementController再请求重定向到create.jsp;即还是那句话,jsp需要在Controller中提供访问入口。
3.编写create.jsp:为文件上传做好准备
文件上传:前提条件
下面,根据文件上传的前提条件,对create.jsp进行编写:
<%@page contentType="text/html;charset=utf-8"%>
<!-- 新增油画页面 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>新增油画</title>
<link rel="stylesheet" type="text/css" href="css\create.css">
<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
</head>
<body>
<div class="container">
<fieldset>
<legend>新增油画</legend>
<!-- enctype="multipart/form-data"只有这样设置,我们选择的文件才能以二进制的形式上传至服务器 -->
<form action="/management?method=create" method="post"
autocomplete="off" enctype="multipart/form-data">
<ul class="ulform">
<li>
<span>油画名称</span>
<span id="errPname"></span>
<input id="pname" name="pname" />
</li>
<li>
<span>油画类型</span>
<span id="errCategory"></span>
<select id="category" name="category">
<option value="-1">请选择油画类型</option>
<option value="1">现实主义</option>
<option value="2">抽象主义</option>
</select>
</li>
<li>
<span>油画价格</span>
<span id="errPrice"></span>
<input id="price" name="price"/>
</li>
<li>
<span>作品预览</span>
<span id="errPainting"></span>
<!-- accept="image/*":表示在文件选择框中默认保留所有图片格式的文件,这相当于是一个文件的筛选条件,
但是这个条件并不靠谱;在后面涉及表单校验的时候,就会明白。 -->
<input id="painting" name="painting" type="file"
style="padding-left: 0px;" accept="image/*" />
</li>
<li>
<span>详细描述</span>
<span id="errDescription"></span>
<textarea
id="description" name="description"></textarea>
</li>
<li style="text-align: center;">
<button type="submit" class="btn-button">提交表单</button>
</li>
</ul>
</form>
</fieldset>
</div>
</body>
</html>
create.jsp的几点说明:
(1)form表单提交方式设为post;enctype="multipart/form-data":设置表单编码类型;
<form action="/management?method=create" method="post"
autocomplete="off" enctype="multipart/form-data">
(2)添加type="file"的input标签;
<input id="painting" name="painting" type="file"
style="padding-left: 0px;" accept="image/*" />
(3)action="/management?method=create" :form表单提交后,设置提交的地址;
<form action="/management?method=create" method="post"
autocomplete="off" enctype="multipart/form-data">
4.在ManagementController类中,添加接收create.jsp表单提交的方法;
可以发现,create.jsp表单提交的地址是ManagementController类:
<form action="/management?method=create" method="post"
autocomplete="off" enctype="multipart/form-data">
(1)不借助第三方组件,“在服务器端”采用传统的策略处理【设计文件上传的请求】时:是不行的;
这个表单提交涉及到了文件上传,如果不借助第三方组件,采用以前的方式,在Controller中通过诸如【request.getParameter("pname");】的方式,获取请求中的数据的时候:
package com.imoo