前些天按照视频里讲的做一个分页功能，可是不知道什么原因在页面就是不显示数据。昨天碰巧发现了一个分页插件，只需一些设置就可以完成分页，非常方便。不过由于是新手，其中遇到了很多很多麻烦，不过幸好得到大神的帮助，最终完成了功能，非常感谢他十分耐心地帮我，给你一个么么哒(づ￣ 3￣)づ
没想到做一个小小的分页功能也有这么多的不懂的地方，感觉要学的东西太多太多，加油努力学习吧~
首先给出项目Github地址：Mybatis通用分页插件
然后按步骤给出各部分代码（其他无关代码和配置文件省略）
一、SqlMapConfig.xml
此处要导入两个jar包：pagehelper-5.0.0.jar和jsqlparser-0.9.5.jar
<!-- 配置分页插件 --><plugins> <plugin interceptor="com.github.pagehelper.PageHelper"> <!-- 指定数据库方言 --> <property name="dialect" value="mysql"/> </plugin></plugins>
二、po
Country.java
public class Country { private Integer id; private String countryname; private String countrycode; public Integer getId() { return id;
} public void setId(Integer id) { this.id = id;
} public String getCountryname() { return countryname;
} public void setCountryname(String countryname) { this.countryname = countryname == null ? null : countryname.trim();
} public String getCountrycode() { return countrycode;
} public void setCountrycode(String countrycode) { this.countrycode = countrycode == null ? null : countrycode.trim();
} @Override
public String toString() { // return (this.getId()+" "+this.getCountryname()+" "+this.getCountrycode());
return "Country [id=" + id +", countryname=" + countryname + ", countrycode=" + countrycode + "]";
}
}EasyUIDataGridResult.java
public class EasyUIDataGridResult { // easyUI dataGrid 返回结果封装
Long total; // 总的记录数
List<?> rows; // 数据集
public Long getTotal() { return total;
} public void setTotal(Long total) { this.total = total;
} public List<?> getRows() { return rows;
} public void setRows(List<?> rows) { this.rows = rows;
}
}三、service
CountryService.java
public interface CountryService { public EasyUIDataGridResult getCountryList(int page, int rows);
}CountryServiceImpl.java
@Servicepublic class CountryServiceImpl implements CountryService{ @Autowired
private CountryMapper countryMapper; public EasyUIDataGridResult getCountryList(int page, int rows) { //分页处理
PageHelper.startPage(page, rows); //查询结果
CountryExample example = new CountryExample();
List<Country> list = countryMapper.selectByExample(example); //获取分页信息
PageInfo<Country> info = new PageInfo<>(list);
EasyUIDataGridResult result = new EasyUIDataGridResult(); long total = info.getTotal(); //封装分页信息
List<Country> row = info.getList();
result.setRows(row);
result.setTotal(total); return result;
}
}四、controller
CountryController.java
@Controllerpublic class CountryController { @Autowired
private CountryService countryService; @RequestMapping("/country/list") @ResponseBody
private EasyUIDataGridResult getItemList(Integer page, Integer rows){
EasyUIDataGridResult countrylists = countryService.getCountryList(page,rows); return countrylists;
}
}五、springmvc.xml
在原来的基础上增加json convertors，以便将List集合转换成json对象，可以使用fastjson或者jackson库，二者择其一就好
注意Jar的版本，我选择的是jackson-core-2.8.7.jar jackson-databind-2.8.7.jar jackson-annotations-2.8.7.jar，三者缺一不可，而且不同的版本可能会导致一些异常
<mvc:annotation-driven> <mvc:message-converters> <bean class="org.springframework.http.converter.StringHttpMessageConverter"/> <bean class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter"/> </mvc:message-converters></mvc:annotation-driven>
六、jsp
countryList.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %><html>
<head>
<title>列表分页展示</title>
<!--必须引入jQuery和easyUI库-->
<link rel="stylesheet" type="text/css" href="../js/jquery-easyui-1.4.1/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="../js/jquery-easyui-1.4.1/themes/icon.css" />
<link rel="stylesheet" type="text/css" href="../css/taotao.css" />
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="../js/jquery-easyui-1.4.1/jquery.min.js"></script>
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="../js/jquery-easyui-1.4.1/jquery.easyui.min.js"></script>
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="../js/jquery-easyui-1.4.1/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="../js/common.js"></script>
</head>
<body>
<table id="dg"></table>
</body>
<script>
$(document).ready(function () {
$('#dg').datagrid({ url:'/country/list', pagination: true, columns:[[
{field:'id',title:'id',width:100},
{field:'countryname',title:'国家名称',width:100,align:'center'},
{field:'countrycode',title:'国家代码',width:100,align:'center'}
]]
});
}); </script></html>最后成果如下所示~
作者：野狗子嗷嗷嗷
链接：https://www.jianshu.com/p/a61650c2a71b
點(diǎn)擊查看更多內(nèi)容
為 TA 點(diǎn)贊
評(píng)論
評(píng)論
共同學(xué)習(xí)，寫下你的評(píng)論
評(píng)論加載中...
作者其他優(yōu)質(zhì)文章
正在加載中
感謝您的支持，我會(huì)繼續(xù)努力的～
掃碼打賞，你說多少就多少
贊賞金額會(huì)直接到老師賬戶
支付方式
打開微信掃一掃，即可進(jìn)行掃碼打賞哦