ssm系列实战(3)——分类分页的实现

本篇为实战系列第三篇，为大家带来分类分页的实现

---

我们在列出书籍时因为书籍数量过多不可能一次列出，那么就需要有一个分页功能来让书籍分页数来显示，让用户有更好的体验，此处分页功能我使用PageHelper这个插件实现的，使用起来十分方便。该插件支持以下数据库：

Oracle
Mysql
MariaDB
SQLite
Hsqldb
PostgreSQL
DB2
SqlServer(2005+)
Informix
H2

首先在pom.xml文件中添加如下依赖：

        <!--分页插件-->
        <dependency>
            <groupId>com.github.pagehelper</groupId>
            <artifactId>pagehelper</artifactId>
            <version>5.0.0</version>
        </dependency>

在mybatis的配置文件中添加如下代码确保分页参数合理化（即当前页数不可小于等于0）

    <plugins>
        <plugin interceptor="com.github.pagehelper.PageInterceptor">
            <!--分页参数的合理化-->
            <property name="reasonable" value="true"></property>
        </plugin>
    </plugins>

接下来就可以随自己心意使用，比如这里首页获取所有书籍。
我们在mapper文件中只需要获取所有的书籍

  <select id="getAllBook" resultType="Book">
    select * from book
  </select>

Service中正常调用该语句

    public List<Book> getAllBook() {
        return bookMapper.getAllBook();
    }

接下来就是关键部分，为设置分页的页数和该页显示商品的数量

    @RequestMapping(value = "/toindex")
    public String toindex(@RequestParam(value = "pageNo",defaultValue = "1") Integer pageNo, Model model){
        PageHelper.startPage(pageNo,10);
        //startPage后面紧跟的就是一个分页查询
        List<Book> books= bookService.getAllBook();
        //使用PageInfo包装查询后的结果，只需将pageInfo交给页面就行了
        //封装了详细的分页信息，包括有我们查询的数据.连续显示的页数
        PageInfo pageInfo=new PageInfo(books,5);
        model.addAttribute("books", books);
        model.addAttribute("pageInfo", pageInfo);
        model.addAttribute("url", "toindex");
        return "buy/BookList";
    }

再比如，在后台的管理员管理书籍或者是用户中也是只在Controller层中有比较复杂的代码：

    @RequestMapping(value = "/user/getAllUser", method = {RequestMethod.GET})
    public String getAllUser(@RequestParam(value = "pageNo", required = false, defaultValue = "0") Integer pageNo, Model model) {
        PageHelper.startPage(pageNo, 10);
        List<User> users = userService.getAllUserRoleUser();
        PageInfo pageInfo = new PageInfo(users, 5);
        model.addAttribute("users", users);
        model.addAttribute("pageInfo", pageInfo);
        return "manager/UserManagement";
    }

至此，分页功能大家也差不多理解了，接下来介绍分类功能：
分类功能那块是在页面上面设置一个表单，当我们选择表单的内容后点击查询就可以将表单提交并从中获取类型，再在后台根据类型查询出该类型的商品。

---

前端中的表单部分：

            <form action="<%=request.getContextPath()%>/book/searchByCategory" method="post">
                <select name="typeList" id="typeList">
                    <option value="">请选择</option>
                </select>
                <input type="submit" class="btn btn-danger" value="查询">
            </form>

后台Controller部分：

    @RequestMapping(value = "/searchByCategory")
    public String searchByCategory(String typeList,Model model) throws Exception{
        List<Book> books=bookService.getAllBookByType(Integer.valueOf(typeList));
        model.addAttribute("books", books);
        return "buy/BookListName";
    }

但这里因为类别我们应设置为动态的，也就是类别应该从数据库中查询出来，让项目的可扩展性更高，所以这里我们使用Ajax技术来实现，如果以前没有学过可以点击下面的连接了解下。

Ajax介绍和使用

这里我们在JSP中使用Ajax将ParentTpye=0的类别列出：

    function locationChange() {
        var type = "";
        var obj = document.getElementById('typeList');
        obj.options.length = 0;
        $.ajax({
            type: "post",
            url: "/book/getParentTypeList",
            cache: false,
            data: {type: type},
            dataType: "json",
            success: function (result) {
                if (result.length > 0) {
                    for (var i in result) {
                        var selectOption = new Option(result[i].name, result[i].cId);
                        obj.add(selectOption);
                    }
                }
            }
        });

在Controller层中返回Json格式的数据

    /**
     * 获取书籍的类别（parent_id为0，因为这里想以后能够扩展出现二级类别），返回Json格式数据
     * @param type
     * @return
     * @throws Exception
     */
    @ResponseBody
    @RequestMapping(value = "/getParentTypeList")
    public String getParentTypeList(@RequestParam(value = "type", required = true) String type) throws Exception {
        List<Category> categoryList  = categoryService.getParentTypeList();
        return JSON.toJSONString(categoryList);
    }

这样的话就成功用Ajax从数据库中拿出了类别并可以分类查找书籍。