分页实现图
可以看到,我这里须要两部分分页,一个是初始化分页,另一个是搜索后结果分页呈现。这是一个网站项目,利用了MVC框架CI来开拓,所用措辞为php,html、js、ajax。分页插件是pagination.js 2.1.2。首先引入pagination.js和pagination.css。
一、初始化分页
加载网页的同时,所要呈现的数据传到了网页,controller里面的代码如图
在适当位置放置一个块,用来放分页,我的是:
html代码
这个时候就可以去写JS代码了,还是直接放代码:
初始化分页js代码
之前忘了说,我也用了Jquery,可以看到,分页分为两步,首先要得到源数据,然后将数据分页显示。
二、查询结果的分页显示
由于要搜索,自然要先传用户输入的数据,再吸收返回的数据,我这里是根据比赛名称来搜索的,还是直接上代码:
搜索的models代码
搜索的controller代码
然后就到如何分页的js代码了
搜索的分页实当代码
源数据我是同过一个函数返回得到的,这个函数通过Ajax获取用户要搜索的数据信息。然后便是将数据分页呈现了,给个实现截图:
搜索分页的实现图
有什么疑问,记得在评论区留言哦。