欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

ssm框架整合3(idea版,带源码)

程序员文章站 2022-06-25 10:02:34
...

前言

本篇文章是ssm框架整合的最后一篇,第一篇第二篇分别讲了如何整合ssm,以及添加,分页查询,删除功能的实现,这一篇主要实现的批量删除,更新,删除功能的实现。

源码下载

百度网盘:6hfh

数据库表修改

book_info新增了图片路径和是否借阅字段

ssm框架整合3(idea版,带源码)

批量删除功能的实现

思路:前端利用多选框接受选中的id值,传到后端,然后编写方法,由于MyBatis没有自动生成批量删除的接口,sql语句,所以我们需要自己实现。代码实现如下:

前端代码实现如下:前端水平很差,凑合着看吧

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" isELIgnored="false" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>主页</title>
    <script src="/resource/js/jquery_2.1.4_baidu_min.js"></script>
    <script type="text/javascript">
        function doPage(pageno) {
            //.给表单的当前也那么赋值
            $("#pageno").val(pageno);
            //提交查询的表单
            $("#query").submit();
        }
        //检查是否选中,选中则可以传值
        function changecheckBox(check) {
            var input = $("input[name='id']");
            if (check) {
                $(input).each(function (i) {
                    this.setAttribute("checked","checked");
//this.setAttribute("checked","true");
                })
            } else {
                $(input).each(function (i) {
                    this.removeAttribute("checked");
                })
            }

        }
        //表单数据提交
        function deleteAll() {
            $("#delete").submit();
        }
    </script>

</head>
<body>
<div style="height: 600px; width: 800px; margin: 0px auto;">


    <form action="index.do" method="post" id="query">
        图书分类<select name="booktypeid">
        <option value="-1">全部</option>
        <c:forEach items="${bookTypes}" var="type">

            <option value="${type.id}"
                    <c:if test="${type.id==booktypeid}">selected="selected"</c:if>>${type.booktypename}</option>
        </c:forEach>
    </select> &nbsp; 图书名称<input name="bookname" value="${bookname}">&nbsp;是否借阅
        <select name="borrow">
        <option value="-1">请选择</option>
        <option value="0"
                <c:if test="${borrow==0 }">selected="selected" </c:if>>未借阅</option>
        <option value="1"
                <c:if test="${borrow==1 }">selected="selected" </c:if>>已借阅</option>

    </select>
        <input type="hidden" name="now" id="pageno">
        <input type="submit" value="查询">
    </form>



    <a href="/toAdd.do">添加</a> &nbsp;
    <button onclick="deleteAll();">批量删除</button>
    <form id="delete" action="/deleteAll.do" method="post">
        <input type="hidden" name="choose" value="7">
        <table>
            <tr>
                <td><input type="checkbox" onclick="changecheckBox(this.checked);"></td>
                <td>图书编号</td>
                <td>图书分类</td>
                <td>图书名称</td>
                <td>作者</td>
                <td>出版社</td>
                <td>详情</td>
                <td>删除</td>
                <td>修改</td>
                <td>下载</td>
            </tr>
            <c:forEach items="${pageInfo.list}" var="book">
                <tr>
                    <td><input type="checkbox" name="id" value="${book.id }"></td>
                    <td>${book.id }</td>
                    <td>${book.bookType.booktypename}</td>
                    <td>${book.bookname }</td>
                    <td>${book.author }</td>
                    <td>${book.press }</td>
                    <td><a href="detail.do?id=${book.id }">详情</a></td>
                    <td><a href="delete.do?id=${book.id }">删除</a></td>
                    <td><a href="edit.do?id=${book.id }">修改</a></td>
                    <td><a href="download.do?imgpath=${book.imgpath}">下载</a></td>
                </tr>
            </c:forEach>
            <tr>
                <td colspan="9"><a href="javascript:doPage(1);">首页</a>&nbsp;&nbsp;
                    <a href="javascript:doPage(${pageInfo.pageNum-1});">上一页</a>&nbsp;&nbsp;
                    <a href="javascript:doPage(${pageInfo.pageNum+1});">下一页</a>&nbsp;&nbsp;
                    <a href="javascript:doPage(${pageInfo.pages});">末页</a>&nbsp;&nbsp;
                    ${pageInfo.pageNum}/${pageInfo.pages}页</td>

            </tr>
        </table>
    </form>
</div>
</body>
</html>

后端代码 :

由于自动生成的代码没有自动生成批量删除的功能,所以我们需要从接口开始。

定义接口

int deleteAll(String[] ids);

xml中实现

<delete id="deleteAll">
    delete from book_info where id in
    <foreach collection="array" item="id" open="(" separator="," close=")" >
      #{id}
    </foreach>
  </delete>

service层

int deleteAll(String[] ids);

service.impl

@Override
    public int deleteAll(String[] ids) {
        return bookInfoService.deleteAll(ids);
    }

controller层方法

 @RequestMapping("/deleteAll.do")
    public void deleteAll(String[] id,HttpServletResponse response) throws IOException {
        for (String ids:id) {
            System.out.println(ids);
        }
        int rows = bookInfoService.deleteAll(id);
        response.setContentType("text/html;charset=UTF-8");
        PrintWriter writer = response.getWriter();

        if(rows>0){
            writer.write("<script type=\"text/javascript\">alert('批量删除成功');location.href=\"index.do\";</script>");
        }else{
            writer.write("<script type=\"text/javascript\">alert('批量删除失败');location.href=\"index.do\";</script>");
        }
    }

 实现效果:

ssm框架整合3(idea版,带源码)

 ssm框架整合3(idea版,带源码)

更新功能实现:

实现思路:点击详情,向后端传参id,查询详细信息,回显到前端,修改后在传递到后端进行修改。

后端代码:

controller层方法

    //编辑页面的回显信息
    @RequestMapping("edit.do")
    public String edit(Integer id,ModelMap map){
        //书籍信息
        BookInfo bookInfo = bookInfoService.selectByPrimaryKey(id);
        map.put("book",bookInfo);
        //书籍类别名称,为了明确显示书籍类别
        List<BookType> bookTypes = bookTypeService.selectByExample(new BookTypeExample());
        map.put("bookTypes",bookTypes);

        return "edit";
    }
    //更新数据
    @RequestMapping("updateBook.do")
    public void update(BookInfo bookInfo, @RequestParam("booktype") String booktype, HttpServletResponse response) throws IOException {
        bookInfo.setBooktypeid(Integer.parseInt(booktype));
        System.out.println(bookInfo);
        int rows = bookInfoService.updateByPrimaryKeySelective(bookInfo);

        response.setContentType("text/html;charset=UTF-8");
        PrintWriter writer = response.getWriter();

        if(rows>0){
            writer.write("<script type=\"text/javascript\">alert('更新成功');location.href=\"index.do\";</script>");
        }else{
            writer.write("<script type=\"text/javascript\">alert('更新失败');location.href=\"edit.do\";</script>");
        }
    }

更新页面

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" isELIgnored="false" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>图书详情</title>
    <!-- 注意引用的顺序  -->
    <script src="/resource/js/jquery_2.1.4_baidu_min.js"></script>
    <!-- jQuery.form.js是一个form插件,支持ajax表单提交和ajax文件上传 -->
    <script src="/resource/js/jquery-form.js"></script>

    <script type="text/javascript">
        function uploadImage() {
            //编写ajax
            var obj = {
                url : "imageupload.do",
                dataType : "json",
                type : "post",
                success : function(data) {
                    $("#img").attr("src", data.imagePath);
                    $("#pic").val(data.imagePath);
                }
            };
            //提交form
            $("#imm").ajaxSubmit(obj);

        }
    </script>


</head>
<body>
<form  id="imm" action="updateBook.do" method="post">
    <table border="1px" style="text-align: center;">
        <tr>
            <td>图书编号</td>
            <td><input name="id" value="${book.id }" disabled></td>
        </tr>
        <tr>
            <td>图书名称</td>
            <td><input name="bookname" value="${book.bookname }">
            </td>
        </tr>
        <tr>
            <td>图书分类</td>
            <td><select name="booktype">
                <c:forEach items="${bookTypes}" var="type">

                    <option value="${type.id}"
                            <c:if test="${type.id==book.booktypeid}">selected="selected"</c:if>>${type.booktypename}</option>
                </c:forEach>
            </select></td>
        </tr>
        <tr>
            <td>作者</td>
            <td><input type="text" name="author"
                       value="${book.author }"></td>
        </tr>
        <tr>
            <td>出版社</td>
            <td><input type="text" name="press"
                       value="${book.press }"></td>
        </tr>
        <tr>
            <td>出版时间</td>
            <td><input type="text" name="publishdate"
                       value="<%--<fmt:formatDate value="${book.publishdate }" pattern="yyyy-MM-dd"/>--%> ${book.publishdate }">
            </td>
        </tr>

        <tr>
            <td>图片上传</td>
            <td><img id="img" src="${book.imgpath}">
                <!-- 显示图片的 --> <input name="fileImage" type="file"
                                      onchange="uploadImage();"> <input type="hidden" name="imgpath"
                                                                        id="pic" value="${book.imgpath}"></td>
        </tr>

        <tr>
            <td colspan="2"><input type="hidden" name="id"
                                   value="${book.id }"> <input type="submit" value="提交">
            </td>

        </tr>
    </table>
</form>
</body>
</html>

ssm框架整合3(idea版,带源码)

ssm框架整合3(idea版,带源码)

封面下载

思路:前端点击下载链接时,将前端存储的路径传到后端,后端根据真实位置将图片转换为文件流传到前端,完成下载。

@Controller
public class DownLoadController {

    @RequestMapping("/download.do")
    public ResponseEntity<byte[]> download(String imgpath) throws IOException {
        String path = "D:\\idea-workspace\\ssm1\\target\\ssm1"+imgpath;
        File file = new File(path);
        HttpHeaders headers = new HttpHeaders();
        //为了解决中文名称乱码问题
        headers.setContentDispositionFormData("attachment", new String("封面.jpg".getBytes("UTF-8"),"iso-8859-1"));
        headers.setContentType(MediaType.APPLICATION_OCTET_STREAM);
        return new ResponseEntity<byte[]>(FileUtils.readFileToByteArray(file), headers, HttpStatus.CREATED);
    }

}

 

 总结:写了三天终于完了,通过这个小项目,熟悉了ssm框架的流程,由于是新手,如果有什么问题,在所难免,欢迎反馈。