学习要点
- 新闻分页显示数据
- 新闻图片上传
JSP分页显示数据
分页
- 数据信息较多的的时候一般采用列表显示,方便展示信息;
- 数据量较大的时候一般采用列表加分页的方式显示,便于阅读。
- 分页方式:集合或者session、存储过程、SQL语句分页
分页步骤
- 确定每页显示的数据数量
- 确定分页显示所需的总页数
- 编写SQL查询语句,实现数据查询
- 在JSP页面中进行分页显示设置
- 对分页过程中的数据进行封装,封装到Page类中
实现过程
- 确定每页显示的数据量:例如:每页显示5条数据
- 计算显示的页数:使用count()函数查询数据库中的记录数;通过记录数和每页数据量计算总页数,把信息封装到Page类中。
- Page类代码
/**分页泛型类*/
public class Page<T> {
// 总页数
private int totalPageCount = 1;
// 页面大小,即每页显示记录数
private int pageSize = 0;
// 记录总数
private int totalCount = 0;
// 当前页号
private int currPageNo = 1;
// 每页数据集合
private List<T> List;
public List<T> getList() {
return List;
}
public void setList(List<T> list) {
List = list;
}
public int getCurrPageNo() {
if (totalPageCount == 0)
return 0;
return currPageNo;
}
public void setCurrPageNo(int currPageNo) {
if (this.currPageNo > 0)
this.currPageNo = currPageNo;
}
public int getTotalPageCount() {
return totalPageCount;
}
public void setTotalPageCount(int totalPageCount) {
this.totalPageCount = totalPageCount;
}
public int getPageSize() {
return pageSize;
}
public void setPageSize(int pageSize) {
if (pageSize > 0)
this.pageSize = pageSize;
}
public int getTotalCount() {
return totalCount;
}
public void setTotalCount(int totalCount) {
if (totalCount > 0) {
this.totalCount = totalCount;
// 计算总页数
totalPageCount = this.totalCount % pageSize == 0 ? (this.totalCount / pageSize)
: this.totalCount / pageSize + 1;
}
}
}
JavaBean的概念:JavaEE项目中对数据或者业务进行封装的简单类。
类似于Page或者News新闻实体类。
News类实现了数据的封装,Page类实现了业务的封装,并且这两个类都没有继承除Object类外的其他类或者实现接口,所有属性进行了封装,有无参构造方法。
4.设计SQL语句
MySQL分页语句:
SELECT * FROM news ORDER BY NID ASC LIMIT (pageindex-1)*pagesize,pagesize;
5.数访问层实现
NewsDao:
public abstract int getTotalCount();
public List<News> getPageNewsList(int pageIndex,int pageSize);
NewsDaoImpl:
/** 获取分页新闻信息 */
public List<News> getPgeNewsList(int pageNo, int pageSize) {
List<News> newsList = new ArrayList<News>();
String sql = "select NID,NTITLE,NCREATEDATE from NEWS order by NCREATEDATE desc LIMIT ?,?";
Object[] args = { (pageNo - 1) * pageSize, pageSize };
ResultSet rs = this.executeQuery(sql, args);
try {
while (rs.next()) {
int nId = rs.getInt("NID");
String nTitle = rs.getString("NTITLE");
Timestamp times = rs.getTimestamp("NCREATEDATE");
SimpleDateFormat sdf = new SimpleDateFormat("YYYY-MM-dd HH:mm:ss");
String nCreateDate = sdf.format(times);
// String nCreateDate = rs.getString("NCREATEDATE");
News news = new News();
news.setNid(nId);
news.setNtitle(nTitle);
news.setNcreatedate(nCreateDate);
newsList.add(news);
}
} catch (Exception e) {
e.printStackTrace();
}
return newsList;
}
/**查询总记录数*/
public int getTotalCount() {
int count = 0;
Connection conn = this.getConnection();
PreparedStatement pstmt = null;
ResultSet rs = null;
String sql = "select count(1) from news";
try {
pstmt = conn.prepareStatement(sql);
rs = pstmt.executeQuery();
if (rs.next()) {
count = rs.getInt(1);
}
} catch (SQLException e) {
e.printStackTrace();
} finally {
this.closeAll(rs, pstmt, conn);
}
return count;
}
6.测试方法
public static void main(String[] args) {
NewsDaoImpl newsDao = new NewsDaoImpl();
int totalCount = newsDao.getTotalCount();
Page<News> page = new Page<News>();
page.setCurrPageNo(3); // 设置当前页面
page.setPageSize(3); // 设置每页条数
page.setTotalCount(totalCount); // 设置总记录数
System.out.println("新闻总数量是:" + page.getTotalCount());
System.out.println("每页条数是:" + page.getPageSize());
System.out.println("总页数:" + page.getTotalPageCount());
System.out.println("当前是第" + page.getCurrPageNo() + "页:");
List<News> newsList = newsDao.getPgeNewsList(page.getCurrPageNo(), page.getPageSize());
page.setList(newsList);// 设置每页显示的集合
for (News news : page.getList()) {
System.out.println(news.getNid() + "\t" + news.getNtitle() + "\t" + news.getNcreatedate());
}
}
7.JSP页面信息页控制代码
当前页数:[<%=pageIndex%>/<%=totalpages%>]
<%
if(pageIndex > 1){ //控制页面显示风格
%>
<a href="pageControl.jsp?pageIndex=1">首页</a>
<a href="pageControl.jsp?pageIndex=<%= pageIndex -1%>">上一页</a>
<% }
if(pageIndex < totalpages){ //控制页面显示风格
%>
<a href="pageControl.jsp?pageIndex=<%= pageIndex +1%>">下一页</a>
<a href="pageControl.jsp?pageIndex=<%=totalpages%>">末页</a>
<%}%>
8.信息处理页参考代码
String pageIndex = request.getParameter("pageIndex");//获得当前页数
if (pageIndex == null) {
pageIndex = "1";
}
int currPageNo = Integer.parseInt(pageIndex);
NewsDaoImpl newsDao = new NewsDaoImpl();
int totalCount = newsDao.getTotalCount();//获得总记录数
Page<News> pages = new Page<News>();
pages.setPageSize(3); //设置每页条数
pages.setTotalCount(totalCount); //设置总记录数
int totalpages = pages.getTotalPageCount();
/*对首页与末页进行控制*/
if (currPageNo < 1) {
currPageNo = 1;
} else if (currPageNo > pages.getTotalPageCount()) {
currPageNo = totalpages;
}
pages.setCurrPageNo(currPageNo); //设置当前页面
List<News> newsList = newsDao.getPgeNewsList(pages.getCurrPageNo(), pages.getPageSize());
pages.setList(newsList); //设置每页显示的集合
request.setAttribute("pages", pages);
request.getRequestDispatcher("index.jsp").forward(request, response);
上机练习:实现新闻分页显示
需求说明
编写代码实现首页新闻标题的分页显示,要求能够执行首页、下一页、上一页、末页的操作,并在页面中显示总页数和当前页
实现思路
- 确定每页显示的新闻数量
- 编写数据库访问类,声明查询方法
- 编写SQL语句
- 编写JavaBean封装分页信息(Page类)
- 在JSP中调用JavaBean
使用Commons-FileUpload上传文件
需求
网页应用中,经常需要上传文件到服务器。上传文件网页代码:
<form action="doupload.jsp" enctype="multipart/form-data" method="post">
<p>姓名:<input type="text" name="user"></p>
<p>选择图片:<input type="file" name="nfile"></p>
<p><input type="submit" value="提交"></p>
</form>
表单要上传文件,需要注意两点:
1、设置enctype属性,值必须为multipart/form-data
2、表单的提交方式必须为post
上传文件组件
- Commons-FileUpload组件可以方便地嵌入到JSP文件中,在JSP文件中仅编写少量代码即可完成文件的上传功能,十分方便。
- 能够全程控制上传内容:可以获得全部上传文件的信息,包括文件名称、类型、大小等,方便操作。
- 能够对上传文件的大小、类型进行控制:为了避免在上传过程中出现异常数据,在Commons-FileUpload组件中,专门提供了相应的方法用于对上传文件进行控制。
获取Commons-FileUpload组件的方式
Commons-FileUpload组件类库:commons-fileupload-1.3.2.jar
Commons-FileUpload组件的API文档: apidocs
Commons-IO组件类库:commons-io-2.5.jar
Commons-IO组件的API文档: commons-io-2.5\docs
Commons-FileUpload组件的API
- ServletFileUpload类的常用方法
方法名称 | 方法描述 |
public void setSizeMax(long sizeMax) | 设置请求信息实体内容的最大允许的字节数 |
public List parseRequest(HttpServletRequest req ) | 解析form表单中的每个字符的数据,返回一个FileItem对象的集合 |
public static final boolean isMultipartContent (HttpServletRequest req ) | 判断请求信息中的内容 是否是“multipart/form-data”类型 |
public void setHeaderEncoding(String encoding) | 设置转换时所使用的字符集编码 |
- FileItem接口的常用方法
方法名称 | 方法描述 |
public boolean isFormField() | 判断FileItem对象封装的数据类型(普通表单字段返回true,文件表单字段返回false) |
public String getName() | 获得文件上传字段中的文件名(普通表单字段返回null) |
public String getFieldName() | 返回表单字段元素的name属性值 |
public void write() | 将FileItem对象中保存的主体内容保存到指定的文件中 |
public String getString() | 将FileItem对象中保存的主体内容以一个字符串返回。其重载方法public String getString(String encoding)中的参数用指定的字符集编码方式 |
public long getSize() | 返回单个上传文件的字节数 |
- FileItemFactory接口与实现类
实现类:DefaultFileItemFactory, DiskFileItemFactory
方法名称 | 方法描述 |
public void setSizeThreshold(int sizeThreshold) | 设置内存缓冲区的大小 |
public void setRepositoryPath(String path ) | 设置临时文件存放的目录 |
文件上传的实现
- 实现步骤
//创建FileItemFactory对象
//创建ServletFileUpload对象
//解析form表单中所有文件
if (普通表单字段){
//获取表单字段的name属性值
if (此属性是“user”)){
//输出XXX上传了文件
}
}else{
//文件表单字段
//获取上传文件的名字
if (名字不为空) {
//保存此文件并输出保存成功
}
}
- 示例代码
<%@page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@page import="java.io.File"%>
<%@page import="org.apache.commons.fileupload.FileItem"%>
<%@page import="org.apache.commons.fileupload.FileItemFactory"%>
<%@page import="org.apache.commons.fileupload.disk.DiskFileItemFactory"%>
<%@page import="org.apache.commons.fileupload.servlet.ServletFileUpload"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<%
request.setCharacterEncoding("utf-8");
String uploadFileName = ""; //上传的文件名
String fieldName = ""; //表单字段元素的name属性值
//请求信息中的内容是否是multipart类型
boolean isMultipart = ServletFileUpload.isMultipartContent(request);
//上传文件的存储路径(服务器文件系统上的绝对文件路径)
String uploadFilePath = request.getSession().getServletContext()
.getRealPath("upload/");
if (isMultipart) {
FileItemFactory factory = new DiskFileItemFactory();
ServletFileUpload upload = new ServletFileUpload(factory);
try {
//解析form表单中所有文件
List<FileItem> items = upload.parseRequest(request);
Iterator<FileItem> iter = items.iterator();
while (iter.hasNext()) { //依次处理每个文件
FileItem item = (FileItem) iter.next();
if (item.isFormField()) { //普通表单字段
fieldName = item.getFieldName(); //表单字段的name属性值
if (fieldName.equals("user")) {
//输出表单字段的值
out.print(item.getString("UTF-8")
+ "上传了文件。<br/>");
}
} else { //文件表单字段
String fileName = item.getName();
if (fileName != null && !fileName.equals("")) {
File fullFile = new File(item.getName());
File saveFile = new File(uploadFilePath,
fullFile.getName());
item.write(saveFile);
uploadFileName = fullFile.getName();
out.print("上传成功后的文件名是:" + uploadFileName);
out.print("<br>文件保存绝对路径为:"+saveFile.getPath());
out.print("<br>文件保存相对路径为:"+"upload\\"+uploadFileName);
}
}
}
} catch (Exception e) {
e.printStackTrace();
}
}
%>
上机练习
需求描述
完成新闻发布信息的添加图片功能
实现思路
1. 添加commons-fileupload.jar和commons-io-2.5.jar
2. 在JSP文件中使用page指令导入Commons-FileUpload类
3. 调用Commons-FileUpload组件相关类的方法获取文件信息并实现保存
控制上传文件的属性
控制文件上传的类型
代码框架
List<String> filType=Arrays.asList("gif","bmp","jpg");
String ext=fileName.substring(fileName.lastIndexOf(".")+1);
if(!filType.contains(ext)){ //判断文件类型是否在允许范围内
out.print("上传失败,文件类型只能是gif、bmp、jpg");
}else{
//上传文件
}
控制文件上传的大小
代码框架
ServletFileUpload upload = new ServletFileUpload(factory);
//设置单个文件的最大限制
upload.setSizeMax(1024*30);
try {
//……省略上传代码
}catch(FileUploadBase.SizeLimitExceededException ex){
out.print(“上传失败,文件太大,单个文件的最大限制是:"+
upload.getSizeMax()+"bytes!");
完整代码示例
<%@page import="org.apache.commons.fileupload.FileUploadBase"%>
<%@page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@page import="java.io.File"%>
<%@page import="org.apache.commons.fileupload.FileItem"%>
<%@page import="org.apache.commons.fileupload.FileItemFactory"%>
<%@page import="org.apache.commons.fileupload.disk.DiskFileItemFactory"%>
<%@page import="org.apache.commons.fileupload.servlet.ServletFileUpload"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<%
request.setCharacterEncoding("utf-8");
String uploadFileName = ""; //上传的文件名
String fieldName = ""; //表单字段元素的name属性值
//请求信息中的内容是否是multipart类型
boolean isMultipart = ServletFileUpload.isMultipartContent(request);
//上传文件的存储路径(服务器文件系统上的绝对文件路径)
String uploadFilePath = request.getSession().getServletContext()
.getRealPath("upload/");
//创建临时文件目录路径
File tempPatchFile = new File("d:\\temp\\buffer\\");
if (!tempPatchFile.exists()) //判断文件或目录是否存在
tempPatchFile.mkdirs(); //创建指定的目录,包括所有必需但不存在的父目录
if (isMultipart) {
DiskFileItemFactory factory = new DiskFileItemFactory();
//设置缓冲区大小4kb
factory.setSizeThreshold(4096);
//设置上传文件用到临时文件存放路径
factory.setRepository(tempPatchFile);
ServletFileUpload upload = new ServletFileUpload(factory);
//设置单个文件的最大限制
upload.setSizeMax(1024 * 30);
try {
//解析form表单中所有文件
List<FileItem> items = upload.parseRequest(request);
Iterator<FileItem> iter = items.iterator();
while (iter.hasNext()) { //依次处理每个文件
FileItem item = (FileItem) iter.next();
if (!item.isFormField()) { //文件表单字段
String fileName = item.getName();
//通过Arrays类的asList()方法创建固定长度的集合
List<String> filType = Arrays.asList("gif", "bmp",
"jpg");
String ext = fileName.substring(fileName
.lastIndexOf(".") + 1);
if (!filType.contains(ext)) //判断文件类型是否在允许范围内
out.print("上传失败,文件类型只能是gif、bmp、jpg");
else {
if (fileName != null && !fileName.equals("")) {
File fullFile = new File(item.getName());
File saveFile = new File(uploadFilePath,
fullFile.getName());
item.write(saveFile);
uploadFileName = fullFile.getName();
out.print("上传成功后的文件名是:" + uploadFileName
+ ",文件大小是:" + item.getSize()
+ "bytes!");
}
}
}
}
} catch (FileUploadBase.SizeLimitExceededException ex) {
out.print("上传失败,文件太大,单个文件的最大限制是:" + upload.getSizeMax()
+ "bytes!");
} catch (Exception e) {
e.printStackTrace();
}
}
%>
上机练习
需求描述
- 管理员在发布新闻时,可以同时实现新闻图片的上传
- 允许上传的图片类型为:GIF文件、JPG文件、JPEG文件、PNG文件
- 上传图片的大小不能超过5MB完成新闻发布信息的添加图片功能
- 管理员选择某一条新闻,单击修改链接后,在新闻编辑页面显示此条新闻内容。
- 编辑好新闻内容后,单击提交按钮更新此条新闻。
上机练习
需求描述
- 管理员选择某一条新闻,单击修改链接后,在新闻编辑页面显示此条新闻内容。
- 编辑好新闻内容后,单击提交按钮更新此条新闻。