[ThinkPHP]自带分页类的使用

好不容易稍微清闲一点,之前的报销单的程序的录入功能也算是上线了,难得的清闲,不能浪费了时间。今天折腾了一天ThinkPHP的分页代码,总共折腾了3大类的分页功能。1.ThinkPHP自带的分页类的分页使用。2.ThinkPHP结合jquery.pagination.js插件实现Ajax无刷新分页。3.ThinkPHP结合jquery.ias.js插件实现无限滚动分页。今天先对ThinkPHP自带的分页功能做下笔记吧。

ThinkPHP数据分页

controller中的代码

//ThinkPHP自带的分页功能
    public function index(){
    $province=M('Province');
    $count=$province->count();
    $page=new \Think\Page($count,5);
    $page->setConfig('first','首页');
    $page->setConfig('prev','上一页');
    $page->setConfig('next','下一页');
    $page->setConfig('end','尾页');
    $page->setConfig('theme', '%HEADER% 共%TOTAL_PAGE%页 %FIRST% %UP_PAGE% %LINK_PAGE% %DOWN_PAGE% %END%');
    $show=$page->show();
    //$list=$province->limit($page->firstRow.','.$page->listRows)->select(); 
    $list=$province->page($_GET['p'],$page->listRows)->select();      
    $this->assign('province',$list);
    $this->assign('page',$show);
    $this->display();        
    }

html模板中的代码

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>ThinkPHP分页功能</title>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" href="__PUBLIC__/css/tp_pagination.css">
</head>
<body>
    <div id="posts">
        <foreach name="province" item="u">
            <div style="line-height:30px; font-size:20px;">
                <span><{$u.provinceid}></span>
                <span><{$u.name}></span>
            </div>
        </foreach>     
    </div>
    <div class="flickr"><{$page}><div/>
</body>
</html>

执行结果

ThinkPHP自带数据分页实例

ThinkPHP数据分页类的样式

可以看到上图的结果,分页的div加入了一些css样式,让原来丑陋的样式也变得赏心悦目起来。这里提供几种不同样式的css代码,只需要将<div class="flickr"><{$page}></div>中的class属性修改为css代码中不同的class名称就可以变换效果。

/*css digg style pagination*/
div.digg {
	padding: 3px;
	margin: 3px;
	text-align: center
}
div.digg a {
	border: #aaaadd 1px solid;
	padding: 2px 5px;
	margin: 2px;
	color: #000099;
	text-decoration: none
}
div.digg a:hover {
	border: #000099 1px solid;
	color: #000;
}
div.digg a:active {
	border: #000099 1px solid;
	color: #000;
}
div.digg span.current {
	border: solid 1px #000099;
	padding: 2px 5px;
	font-weight: bold;
	margin: 2px;
	color: #fff;
	background-color: #000099;
}
div.digg span.disabled {
	border: #eee 1px solid;
	padding: 2px 5px;
	margin: 2px;
	color: #ddd;
}
/*css yahoo style pagination*/
div.yahoo {
	margin: 3px;
	padding: 3px;
	text-align: center
}
div.yahoo a {
	border: #fff 1px solid;
	padding: 2px 5px;
	margin: 2px;
	color: #000099;
	text-decoration: underline;
}
div.yahoo a:hover {
	border: #000099 1px solid;
	color: #000;
}
div.yahoo a:active {
	border: #000099 1px solid;
	color: #f00;
}
div.yahoo span.current {
	border: #fff 1px solid;
	padding: 2px 5px;
	font-weight: bold;
	margin: 2px;
	color: #000;
	background-color: #fff;
}
div.yahoo span.disabled {
	border: #eee 1px solid;
	padding: 2px 5px;
	margin: 2px;
	color: #ddd;
}
/*css meneame style pagination*/
div.meneame {
	padding: 3px;
	font-size: 80%;
	margin: 3px;
	color: #ff6500;
	text-align: center;
}
div.meneame a {
	border: #ff9600 1px solid;
	padding: 5px 7px;
	background-position: 50% bottom;
	background-image: url(../images/meneame.jpg);
	margin: 0 3px 0 0;
	text-decoration: none;
}
div.meneame a:hover {
	border: #ff9600 1px solid;
	background-image: none;
	color: #ff6500;
	background-color: #ffc794;
}
div.meneame a:active {
	border: #ff9600 1px solid;
	background-image: none;
	color: #ff6500;
	background-color: #ffc794;
}
div.meneame span.current {
	border: #ff6500 1px solid;
	padding: 5px 7px;
	font-weight: bold;
	color: #ff6500;
	margin: 0 3px 0 0;
	background-color: #ffbe94;
}
div.meneame span.disabled {
	border: #ffe3c6 1px solid;
	padding: 5px 7px;
	color: #ffe3c6;
	margin: 0 3px 0 0;
}
/*css flickr style pagination*/
div.flickr {
	padding: 3px;
	margin: 3px;
	text-align: center;
}
div.flickr a {
	border: #dedfde 1px solid;
	padding: 2px 6px;
	background-position: 50% bottom;
	color: #0061de;
	margin: 0 3px 0 0;
	text-decoration: none;
}
div.flickr a:hover {
	border: #000 1px solid;
	background-image: none;
	color: #fff;
	background-color: #0061de;
}
div.meneame a:active {
	border: #000 1px solid;
	background-image: none;
	color: #fff;
	background-color: #0061de
}
div.flickr span.current {
	padding: 2px 6px;
	font-weight: bold;
	color: #ff0084;
	margin: 0 3px 0 0;
}
div.flickr span.disabled {
	padding: 2px 6px;
	color: #adaaad;
	margin: 0 3px 0 0;
}
/*css sabrosus style pagination*/
div.sabrosus {
	padding: 3px;
	margin: 3px;
	text-align: center;
}
div.sabrosus a {
	border: #9aafe5 1px solid;
	padding: 2px 5px;
	margin: 0 2px 0 0;
	text-decoration: none;
}
div.sabrosus a:hover {
	border: #2b66a5 1px solid;
	color: #000;
	background-color: lightyellow;
}
div.pagination a:active {
	border: #2b66a5 1px solid;
	color: #000;
	background-color: lightyellow;
}
div.sabrosus span.current {
	border: navy 1px solid;
	padding: 2px 5px;
	font-weight: bold;
	color: #fff;
	margin: 0 2px 0 0;
	background-color: #2e6ab1
}
div.sabrosus span.disabled {
	border: #929292 1px solid;
	padding: 2px 5px;
	margin: 0 2px 0 0;
}
/*css scott style pagination*/
div.scott {
	padding: 3px;
	margin: 3px;
	text-align: center;
}
div.scott a {
	border: #ddd 1px solid;
	padding: 2px 5px;
	color: #88af3f;
	margin: 0 2px 0 0;
	text-decoration: none;
}
div.scott a:hover {
	border: #85bd1e 1px solid;
	color: #638425;
	background-color: #f1ffd6;
}
div.scott a:active {
	border: #85bd1e 1px solid;
	color: #638425;
	background-color: #f1ffd6;
}
div.scott span.current {
	border: #b2e05d 1px solid;
	padding: 2px 5px;
	font-weight: bold;
	color: #fff;
	margin: 0 2px 0 0;
	background-color: #b2e05d;
}
div.scott span.disabled {
	border: #f3f3f3 1px solid;
	padding: 2px 5px;
	color: #ccc;
	margin: 0 2px 0 0;
}
/*css quotes style pagination*/
div.quotes {
	padding: 3px;
	margin: 3px;
	text-align: center;
}
div.quotes a {
	border: #ddd 1px solid;
	padding: 2px 5px;
	color: #aaa;
	margin: 0 2px 0 0;
}
div.quotes a:hover {
	border: #a0a0a0 1px solid;
	padding: 2px 5px;
	margin: 0 2px 0 0;
}
div.quotes a:active {
	border: #a0a0a0 1px solid;
	padding: 2px 5px;
	margin: 0 2px 0 0;
}
div.quotes span.current {
	border: #e0e0e0 1px solid;
	padding: 2px 5px;
	font-weight: bold;
	color: #aaa;
	margin: 0 2px 0 0;
	background-color: #f0f0f0;
}
div.quotes span.disabled {
	border: #f3f3f3 1px solid;
	padding: 2px 5px;
	color: #ccc;
	margin: 0 2px 0 0;
}

分享到:更多 ()

23

评论前必须登录!

 

  1. #2

    到此一游!

  2. #1

    I am sure this piece of writing has touched all the internet visitors, its really really nice article on building up new weblog.|