TP5框架实现自定义分页样式的方法示例

微信扫一扫,分享到朋友圈

TP5框架实现自定义分页样式的方法示例

本文实例讲述了TP5框架实现自定义分页样式的方法。分享给大家供大家参考,具体如下:

1. 在extend目录下创建page目录,在page目录下创建Page.php文件,将以下代码放入文件中。

<?php
namespace page;
use thinkPaginator;
class Page extends Paginator
{
//首页
protected function home() {
if ($this->currentPage() > 1) {
return "<a href='" . $this->url(1) . "' title='首页'>首页</a>";
} else {
return "<p>首页</p>";
}
}
//上一页
protected function prev() {
if ($this->currentPage() > 1) {
return "<a href='" . $this->url($this->currentPage - 1) . "' title='上一页'>上一页</a>";
} else {
return "<p>上一页</p>";
}
}
//下一页
protected function next() {
if ($this->hasMore) {
return "<a href='" . $this->url($this->currentPage + 1) . "' title='下一页'>下一页</a>";
} else {
return"<p>下一页</p>";
}
}
//尾页
protected function last() {
if ($this->hasMore) {
return "<a href='" . $this->url($this->lastPage) . "' title='尾页'>尾页</a>";
} else {
return "<p>尾页</p>";
}
}
//统计信息
protected function info(){
return "<p class='pageRemark'>共<b>" . $this->lastPage .
"</b>页<b>" . $this->total . "</b>条数据</p>";
}
/**
* 页码按钮
* @return string
*/
protected function getLinks()
{
$block = [
'first' => null,
'slider' => null,
'last'  => null
];
$side  = 3;
$window = $side * 2;
if ($this->lastPage < $window + 6) {
$block['first'] = $this->getUrlRange(1, $this->lastPage);
} elseif ($this->currentPage <= $window) {
$block['first'] = $this->getUrlRange(1, $window + 2);
$block['last'] = $this->getUrlRange($this->lastPage - 1, $this->lastPage);
} elseif ($this->currentPage > ($this->lastPage - $window)) {
$block['first'] = $this->getUrlRange(1, 2);
$block['last'] = $this->getUrlRange($this->lastPage - ($window + 2), $this->lastPage);
} else {
$block['first'] = $this->getUrlRange(1, 2);
$block['slider'] = $this->getUrlRange($this->currentPage - $side, $this->currentPage + $side);
$block['last']  = $this->getUrlRange($this->lastPage - 1, $this->lastPage);
}
$html = '';
if (is_array($block['first'])) {
$html .= $this->getUrlLinks($block['first']);
}
if (is_array($block['slider'])) {
$html .= $this->getDots();
$html .= $this->getUrlLinks($block['slider']);
}
if (is_array($block['last'])) {
$html .= $this->getDots();
$html .= $this->getUrlLinks($block['last']);
}
return $html;
}
/**
* 渲染分页html
* @return mixed
*/
public function render()
{
if ($this->hasPages()) {
if ($this->simple) {
return sprintf(
'%s<div class="pagination">%s %s %s</div>',
$this->css(),
$this->prev(),
$this->getLinks(),
$this->next()
);
} else {
return sprintf(
'%s<div class="pagination">%s %s %s %s %s %s</div>',
$this->css(),
$this->home(),
$this->prev(),
$this->getLinks(),
$this->next(),
$this->last(),
$this->info()
);
}
}
}
/**
* 生成一个可点击的按钮
*
* @param string $url
* @param int  $page
* @return string
*/
protected function getAvailablePageWrapper($url, $page)
{
return '<a href="' . htmlentities($url) . '" rel="external nofollow" title="第"'. $page .'"页" >' . $page . '</a>';
}
/**
* 生成一个禁用的按钮
*
* @param string $text
* @return string
*/
protected function getDisabledTextWrapper($text)
{
return '<p class="pageEllipsis">' . $text . '</p>';
}
/**
* 生成一个激活的按钮
*
* @param string $text
* @return string
*/
protected function getActivePageWrapper($text)
{
return '<a href="" class=" rel="external nofollow" cur">' . $text . '</a>';
}
/**
* 生成省略号按钮
*
* @return string
*/
protected function getDots()
{
return $this->getDisabledTextWrapper('...');
}
/**
* 批量生成页码按钮.
*
* @param array $urls
* @return string
*/
protected function getUrlLinks(array $urls)
{
$html = '';
foreach ($urls as $page => $url) {
$html .= $this->getPageLinkWrapper($url, $page);
}
return $html;
}
/**
* 生成普通页码按钮
*
* @param string $url
* @param int  $page
* @return string
*/
protected function getPageLinkWrapper($url, $page)
{
if ($page == $this->currentPage()) {
return $this->getActivePageWrapper($page);
}
return $this->getAvailablePageWrapper($url, $page);
}
/**
* 分页样式
*/
protected function css(){
return ' <style type="text/css">
.pagination p{
margin:0;
cursor:pointer
}
.pagination{
height:40px;
padding:20px 0px;
}
.pagination a{
display:block;
float:left;
margin-right:10px;
padding:2px 12px;
height:24px;
border:1px #cccccc solid;
background:#fff;
text-decoration:none;
color:#808080;
font-size:12px;
line-height:24px;
}
.pagination a:hover{
color:#077ee3;
background: white;
border:1px #077ee3 solid;
}
.pagination a.cur{
border:none;
background:#077ee3;
color:#fff;
}
.pagination p{
float:left;
padding:2px 12px;
font-size:12px;
height:24px;
line-height:24px;
color:#bbb;
border:1px #ccc solid;
background:#fcfcfc;
margin-right:8px;
}
.pagination p.pageRemark{
border-style:none;
background:none;
margin-right:0px;
padding:4px 0px;
color:#666;
}
.pagination p.pageRemark b{
color:red;
}
.pagination p.pageEllipsis{
border-style:none;
background:none;
padding:4px 0px;
color:#808080;
}
.dates li {font-size: 14px;margin:20px 0}
.dates li span{float:right}
</style>';
}
}

2. 修改  applicationconfig.php  中的配置文件即可

//分页配置
'paginate'        => [
'type'   => 'pagePage',//分页类
'var_page' => 'page',
'list_rows' => 15,
],

3. 分页样式为

更多关于thinkPHP相关内容感兴趣的读者可查看本站专题:《ThinkPHP入门教程》、《thinkPHP模板操作技巧总结》、《ThinkPHP常用方法总结》、《codeigniter入门教程》、《CI(CodeIgniter)框架进阶教程》、《Zend FrameWork框架入门教程》及《PHP模板技术总结》。

希望本文所述对大家基于ThinkPHP框架的PHP程序设计有所帮助。

时间:2020-04-05

本文实例讲述了ThinkPHP5.1+Ajax实现的无刷新分页功能.分享给大家供大家参考,具体如下: 无刷新分页可以减轻服务器负担,利用Ajax技术,请求部分信息,提高网站访问速度,是网站建设的必备技术. 需要在后台展示自定义属性列表(lst.html),其中的列表部分摘出来,放到(paginate1.html)中: <div class=”row”> <div class=”col-sm-12″> <div class=”i

本文实例讲述了thinkPHP5分页功能实现方法.分享给大家供大家参考,具体如下: 其实分页自身的内容也不是很多.不过牵扯到样式的问题感觉挺烦.于是找到了分页类看了一下.把大体的结构说一下.如果有需要修改页面样式的可以自行修改样式.最好提前备份,防止意外. 首先是分页的调用,tp5的调用相对非常容易 $mod = new appindexmodelBlogmsg(); $mo = $mod->paginate(1,14); $this->assign(‘list’, $mo); //

本文实例讲述了tp5框架无刷新分页实现方法.分享给大家供大家参考,具体如下: 已tp5 分页为例, 1.默认生成的分页 页码如下: <ul class=”pagination”> <li><a href=”https://www.tuicool.com/articles/EN7BNvj/?page=1″ rel=”external nofollow” rel=”external nofollow” >«</a></li> <li><

本文实例讲述了thinkphp5+layui实现的分页样式.分享给大家供大家参考,具体如下: tp5之layui分页样式 1.分页类 路径:thinkphplibrarythinkpaginatordriver Layui.php <?php namespace thinkpaginatordriver; use thinkPaginator; class Layui extends Paginator { /** * 上一页按钮 * @param string $text *

本文实例讲述了thinkPHP5分页样式类.分享给大家供大家参考,具体如下: 在配置文件中改路径 把这段代码放入extend文件下 可以在这个文件下创建个page文件 在分页的控制器方法中 ->paginate(12,false,[ ‘type’=> ‘pagePage’,’var_page’=>’page’]); <?php namespace page; // +———————————————————

本文实例讲述了thinkPHP5.1框架使用SemanticUI实现分页功能.分享给大家供大家参考,具体如下: 1.config目录下新建paginate.php,下面是文件的内容 <?php //分页配置 return [ ‘type’ => ‘Semantic’, ‘var_page’ => ‘page’, ]; 2.thinkphplibrarythinkpaginatordriver下新建Semantic.php,下面是文件的内容 <?php /** * Crea

本文实例讲述了thinkPHP5框架实现分页查询功能的方法.分享给大家供大家参考,具体如下: controller文件内Admin.php <?php namespace appadmincontroller; use thinkController; use appadminmodelAdmin as AdminModel; //使用分页类 取别名解决类名冲突 class Admin extends Controller{ public function lst(){ /* 分页开

本文实例讲述了tp5框架内使用tp3.2分页的方法.分享给大家供大家参考,具体如下: tp5内使用tp3.2分页 由于百度上面太多坑,所以自己拿来去改了一下 下面是完全可行的操作 首先吧tp3.2的分页复制出来,拿到tp5 extend文件夹下面的org里面,把tp3.2的分页名称改为Page.php 然后改一下里面的代码 下面是改过后的代码 <?php namespace org;//命名规范 class Page{ public $firstRow; // 起始行数 public $list

本文实例讲述了ThinkPHP5&5.1框架关联模型分页操作.分享给大家供大家参考,具体如下: 利用数据库的分页通常比较简单,但在实际项目中,我们往往需要处理复杂的数据,例如多表操作,这时候我们就需要利用模型层的关联操作得到最终想要的数据,而这些数据我们其实也是可以利用ThinkPHP5&5.1内置的分页引擎进行分页的. 卖的车辆我们称之为车源,车源和车主之间是多对一关系(车主可以有多辆车,一辆车只属于一个车主):车源和车辆图片之间是一对多关系(一辆车有多个图片,一个图片只属于一辆车):车

一.背景 在使用thinkPHP框架做项目的时候,经常会遇到对列表的内容进行分页.thinkPHP框架中自带了分页功能,但是有缺陷.这个缺陷是每次返回每页数据给页面时需要重新加载页面所需要的JS.CSS等资源.如果页面包含的JS过多.过大,会增加流量压力.因此,我们使用laypage插件.每次使用ajax请求获取每页的数据就可以了,不需要重复加载页面. 二.分页流程 如下图所示: 流程说明: 1) 调研App.php中的函数,该函数调用fetch函数.fetch函数渲染list.html.   

本文实例讲述了thinkPHP5框架实现基于ajax的分页功能.分享给大家供大家参考,具体如下: 最近一个页面的选项卡又牵扯到ajax分页,所以研究了一下tp5的ajax分页使用方法 首先看一下tp5的分页功能介绍 参数 描述 list_rows 每页数量 page 当前页 path url路径 query url额外参数 fragment url锚点 var_page 分页变量 type 分页类名 $caseDetails = CaseDetails::where([‘status’=>1])

本文实例讲述了thinkphp5框架前后端分离项目实现分页功能的方法.分享给大家供大家参考,具体如下: 方法一 利用tp5提供的paginate方法实现自动分页 参数 page第几页,paginate分页方法会自动获取 size  每页数量 代码 /** * Notes:消费记录 * Date: 2019/6/25 * Time: 15:43 * @param Request $request * @return thinkresponseJson */ public function g

在写这篇文章的时候,顺带学习了一下关于Markdown的使用方法. 笔者是个渣渣,一切都是自己在摸索的学着,所以也谈不上什么体系.系统学习.在这里主要是为了实现把项目前后端分离开. 这里假设你的电脑上所需的django.vue.js已经有了,如果没有,往下拉就是vue.js的安装流程.django前面写过了,就不赘述了. 一,正常搭建前后端分离项目流程 1.创建django项目 命令: django-admin startproject ulb_manager 结构: ├── manage.py

本文实例分析了CI框架实现框架前后端分离的方法.分享给大家供大家参考,具体如下: 我们在使用CI框架开发中(或者使用所有的其他框架开发中),总是习惯于将所开发项目的前端和后台分离开来,将各自的控制器.模型或视图放到不同的文件夹中.在这一点上ThinkPHP框架要比CI框架更要方便一些.这篇博文我们就讲述如何实现根据CI框架开发将前后端实现分离.(本文以本人开发的Pkadmin后台管理系统为例,Pkadmin后台管理系统是基于Codeigniter_v3.1.0框架和Olive Admin后台模版

首先,谈下这篇文章中的前后端所涉及到的技术框架内容. 虽然是后端的管理项目,但整体项目,是采用前后端分离的方式完成,这样做的目的也是产品化的需求: 前端,vue+vuex+vue router+webpack+elementUI的方案完成框架的搭建,其中用到了superUI来作为后端登陆之后的主页面框架,中间集成vue的大型单页应用: 后端,springboot+spring+springmvc+spring serurity+mybatis+maven+redis+dubbo +zookeep

最近学习使用vuejs前后端分离,重构一个已有的后台管理系统,遇到了下面这个问题: 实现跨域请求时,每次ajax请求都是新的session,导致无法获取登录信息,所有的请求都被判定为未登陆. 1. vuejs ajax跨域请求 最开始使用的是vue-resource,结果发现vue2推荐的是axios,于是改成axios:安装axios npm install axios -S 安装完成后在main.js中增加一下配置: import axios from ‘axios’; axios.defa

本文实例讲述了Yii框架结合sphinx,Ajax实现搜索分页功能的方法.分享给大家供大家参考,具体如下: 效果图: 控制器: <?php namespace backendcontrollers; use Yii; use yiiwebController; use yiidataPagination; use SphinxClient; use yiidbQuery; use yiiwidgetsLinkPager; use backendmodelsGoods; cl

前言 使用Node做前后端分离的开发模式带来了一些性能及开发流程上的优势, 但同时也面临不少挑战.在淘宝复杂的业务及技术架构下,后端必须依赖Java搭建基础架构,同时提供相关业务接口供前端使用.Node在整个环境中最重要的工作之一就是代理这些业务接口,以方便前端(Node端和浏览器端)整合数据做页面渲染.如何做好代理工作,使得前后端开发分离之后,仍然可以在流程上无缝衔接,是我们需要考虑的问题.本文将就该问题做相关探讨,并提出解决方案. 由于后端提供的接口方式可能多种多样,同时开发人员在编写Nod

基本介绍 首先从一个重要的概念”模板”说起. 广义上来说,web中的模板就是填充数据后可以生成文件的页面. 严格意义上来说,应该是模板引擎利用特定格式的文件和所提供的数据编译生成页面.模板大致分为前端模板(如ejs)和后端模板(如freemarker)分别在浏览器端和服务器端编译. 由于当场有一部分同学对node.js并不是很了解,这里补充一下node.js的相关知识.官网上的给他的定义事件驱动.异步什么的就不说了.这里借用朴灵书上的一张图来解释一下node.js这个玩意的结构.如果懂

​背景:由于后端程序猿通常对CSS .JS掌握不是特别好,通常的开发模式,UI把静态html做好交给程序猿,程序猿开发,把静态html变成动态的时候经常会有各种样式错乱的问题,并且要迎合上级一天三遍样式需求,因此决定用前后端分离.考虑到网站的推广,又必须做SEO.前端框架选择VUE,解决SSR顺便选择了nuxt.js,此为背景. 一.准备工作 1.安装nodejs 2.安装vuejs 3.安装vue-cli 4.安装nuxt 二.创建nuxt项目并配置 找一个自己喜欢的目录,作为你的worksp

前言 前端用什么框架都可以,这里选择小巧的vuejs. 要实现的功能很简单: 1.登录功能,成功将服务器返回的token存在本地 2.使用带token的header访问服务器的一个资源 本次实验环境: “dependencies”: { “vue”: “^2.2.1” }, “devDependencies”: { “babel-core”: “^6.0.0”, “babel-

微信扫一扫,分享到朋友圈

TP5框架实现自定义分页样式的方法示例

Zoom被发现对其加密技术进行了虚假宣传

上一篇

深入浅出 JVM (一)

下一篇

你也可能喜欢

TP5框架实现自定义分页样式的方法示例

长按储存图像,分享给朋友