1.在学习过程中,积累和思考是必须的,所以我还是选择用博客一边记录一边学习
一款简单的分页插件下载地址:
插件下载地址
解压之后分别把.css文件和.js文件导入相应的项目文件夹中,并且在页面中进行路径引入,确保无误。
具体做法前台:
分页:` <table id="mytable"></table>
<ul class="page" id="page"></ul>`
前台通过Ajax传输数据给后台` $.ajax({
url : "请求地址",
type : "传输方式",
data :"json数据"
dataType:"json",
success : function(data){
"id":"page",//显示页码的元素
"data":data,//显示数据
"maxshowpageitem":3,//最多显示的页码个数
"pagelistcount":5,//每页显示数据个数
"callBack":function(result){
var myHtml="";
console.log(result)//测试取到的数据
for(var i=0;i<result.length;i++){
myHtml=<tr></tr> //循环数据追加到 myHtml
}
$("#mytable").html(cHtml)//add
}
};
page.init(data.length,1,options);执行分页函数
}
`
Servlet通过JSON格式数据
<!-- https://mvnrepository.com/artifact/com.googlecode.json-simple/json-simple -->
<dependency>
<groupId>com.googlecode.json-simple</groupId>
<artifactId>json-simple</artifactId>
<version>1.1.1</version>
</dependency>
@RequestMapping("URL")
@ResponseBody//ajax
public String showClasss(HttpServletRequest req){
//ajax传输的数据
String cname=req.getParameter("cname");
String ename=req.getParameter("ename");
List<StudentGrade> studentsGrade = ig.getStudentsGrade(cname, ename);
//JSONArray格式数据
JSONArray json = new JSONArray();
for (StudentGrade sg : studentsGrade) {
JSONObject jo = new JSONObject();
jo.put("sno",sg.getSno());
jo.put("sname",sg.getSname());
jo.put("cname",sg.getCname());
jo.put("ename",sg.getEname());
jo.put("score",sg.getScore());
json.add(jo);
}
return json.toString();
}