文档章节

laravel自定义分页模版

jichun
 jichun
发布于 2017/08/28 18:20
字数 538
阅读 46
收藏 0

laravel自身paginate()等分页的样式比较简单,而且生成的html只支持 Bootstrap CSS。

1、简单粗暴的修改

laravel5.4里面分页样式模版在目录与文件是:           
 \vendor\laravel\framework\src\Illuminate\Pagination\resources\views\default.blade.php
若想简单粗暴修改模版,直接修改default.blade.php的代码即可。

2、替换默认模版

本人不太愿意过多的去修改框架自身的代码。选择新建分页模版。

(1)创建替换blade模板

在 resources\views 目录创建分页模版。本人是再 resources\views\layouts 创建了 page.blade.php模版

(2)指定 统一默认模版

在 app\Providers\AppServiceProvider.php 的 boot() 方法里,添加如下代码:
\Illuminate\Pagination\LengthAwarePaginator::defaultView('layouts.page'); 
// 这里layouts.page是你分页模版的路径

刷新页面,新模版即生效,而且也不需要你在前端页面指定模版。直接在其它blade里面执行 
{{ $xxx->links() }} 即可调用成功 。($xxx为你传递到页面的数据,如paginate() 查询后传递的数值 )

(3)单个指定分页模版

在前端blade.php里面,也可以单独指定模版。假如分页模版文件为:
 resources\views\layouts\page.blade.php
只需在前端x.blade.php加上 {{ $xxx->links('layouts.page') }} 即可

自己用的是layui 前端框架,其分页模版代码如下,方便自己下次copy

@if ($paginator->hasPages())
<div id="page">
 <div class="layui-box layui-laypage layui-laypage-default" id="layui-laypage-1">
         {{-- Previous Page Link --}}
     @if ($paginator->onFirstPage())
         <a href="javascript:;" class="layui-laypage-prev layui-disabled" data-page="0">上一页</a>
     @else
         <a href="{{ $paginator->previousPageUrl() }}" class="layui-laypage-prev" data-page="{{ $paginator->currentPage() -1 }}">上一页</a>
     @endif

         {{-- Pagination Elements --}}
         @foreach ($elements as $element)

             {{-- Array Of Links --}}
             @if (is_array($element))
                 @foreach ($element as $page => $url)
                     @if ($page == $paginator->currentPage())
                         <span class="layui-laypage-curr"><em class="layui-laypage-em"></em><em>{{ $page }}</em></span>
                     @else
                          <a href="{{ $url }}" data-page="{{ $page }}">{{ $page }}</a>
                     @endif
                 @endforeach
             @endif
         @endforeach

         {{-- Next Page Link --}}
         @if ($paginator->hasMorePages())
             <a href="{{ $paginator->nextPageUrl() }}" class="layui-laypage-next" data-page="{{ $page }}">下一页</a>
         @else
             <a href="javascript:;" class="layui-laypage-next layui-disabled" data-page="{{ $page }}">下一页</a>
         @endif
         <span class="layui-laypage-count">共 {{ $paginator->total() }} 条</span>
         <span class="layui-laypage-skip">到第
             <input type="text" min="1" name="page" value="1" class="layui-input" id="inputpage">页
             <a class="layui-laypage-btn" onclick="set_pageurl()" href = "javascript:;" >确定</a>
         </span>
     </div>
 </div>
 <script type="text/javascript">
     function set_pageurl(){
         var jump_page = document.getElementById('inputpage').value;
         var search = window.location.search
         if (search.length > 0){
             if (search.indexOf('page') > -1){
                 jump_url = search.replace(/page=\d/,'page=' + jump_page)
             } else {
                 jump_url = search + '&page=' + jump_page;
             }
         } else {
             jump_url = '?page='+ jump_page;
         }
         window.location.href = jump_url
     }
 </script>
@endif

© 著作权归作者所有

jichun
粉丝 0
博文 22
码字总数 8821
作品 0
深圳
私信 提问
Laravel5学生成绩管理系统-05-分页

在其它的框架中,分页是非常让人苦恼的。而在 Laravel 中却是很轻而易举的。 Laravel 可以快速生成基于当前页面链接的智能「范围」,并且生成的 HTML 兼容于 Bootstrap CSS 框架。本项目中,...

Corwien
2016/05/21
114
0
Laravel5.4实战快速开发自媒体网站教程 Laravel实战教程

第1章 课程介绍 介绍课程的大体脉络和课程安排 第2章 Laravel 5.4介绍 本节课会带领大家介绍laravel的各个版本历史以及讨论php框架的未来发展趋势。把laravel周边的生态环境一一展示。 第3章...

15543595340
2018/05/19
0
0
laravel5自定义分页

laravel5分页处理与laravel4略有区别,laravel5提供了更方便的处理方式,可以方便满足不同分页展示。 laravel4自定义分页:http://php2012web.blog.51cto.com/5585213/1539601 laravel分页处...

ttlxihuan
2016/09/26
0
0
laravel5.3的新功能尝鲜

上一节课 https://my.oschina.net/lilugirl2005/blog/783370 上一节课我们讲了laravel5.3的安装,这节讲laravel5.3的一些基础命令和配置 Listeners文件夹 进入laravel项目目录输入命令 创建用...

lilugirl
2016/11/14
136
0
Laravel --实战篇 (自定义分页类)

前言 : 框架中有封装好的分页类方法,但是这个方法如果是在数据量比较大的项目中,无疑是在无形中给项目挖了一个隐藏的坑,因为如果是看DB类源码的分页基础是把所有的数据都拿了,只不过根据给...

zhiqiangw
2016/10/06
72
0

没有更多内容

加载失败,请刷新页面

加载更多

parseint和isNaN用法

本文转载于:专业的前端网站➭parseint和isNaN用法 <!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title></head><body><script> var a='12'; alert......

前端老手
今天
7
0
Kylin 精确去重在用户行为分析中的妙用

作者:史少锋,Apache Kylin committer & PMC,2019/10/11 在上次文章《如何在 1 秒内做到大数据精准去重》中,我们介绍了 Apache Kylin 为什么要支持大数据集上的精确去重,以及基于 Bitmap...

ApacheKylin
今天
5
0
学习记录(二) es6基本语法(rest参数,模板化,axios模块,拦截器)

日常学习记录 模块化:把一个大文件分成多个小文件,按照一定规范进行拼接 es5写法: 导出:module.exports = 数据 导入:require("路径") /路径未添加后缀名时 //默认添加.js //把路径作为文件名...

Pole丶逐
今天
4
0
以程序员的角度怎么购买一台「性价比高的电视」

前俩天有小伙伴在我的文章下留言,说能否把 【国内电视机都介绍一下】,今天我已在TV端开发多年的程序员的角度。谈谈已程序员的角度如何购买一台性价比高的电视。 国内大的电视机品牌介绍 长...

我们都很努力着
今天
5
0
PhotoShop 色调:理解直方图/RGB通道信息

一、直方图:图表的形式,展示图像像素分布的情况 1.平均值:表示平均亮度 2.标准偏差值:表示亮度值范围内的中间值 3.像素: 表示用于计算直方图的像素总数 4.色阶:显示指针下面的区域亮度...

东方墨天
今天
8
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部