Laravel 自定义分页、可以调整、显示数目
{{-- 增加输入框,跳转任意页码和显示任意条数 --}}
<ul class="pagination pagination-sm">
<li>
<span data-toggle="tooltip" data-placement="bottom" title="输入页码" style=" padding: 3.5px; margin-top: 3px;">
第 <input type="text" class="text-center no-padding" name="{{ $name or 'page' }}" form="{{ $formId or '' }}" value="{{ $data->currentPage() or '1' }}" id="{{ $id or 'customPage'}}" data-total-page="{{ $data->lastPage() }}" style="width: 50px;"> 页 / 共 {{ $data->lastPage() }} 页
</span>
</li>
<li style="">
<span data-toggle="tooltip" data-placement="bottom" title="选择每页显示条数" style=" padding: 5.5px; margin-top: 3px;">
<!-- 每页 <input type="text" class="text-center no-padding" name='perPage' form="{{ $formId or '' }}" value="{{ $data->perPage() }}" id="customLimit" data-total="{{ $data->total() }}" style="width: 50px;" > 条 / 共 {{ $data->total() }} 条
<div class="form-group"> -->
<label class="text-center no-padding no-margin">每页显示:</label>
<select id="perPage" class="text-center no-padding" name='perPage' form="{{ $formId or '' }}" style="width: 50px;">
<option {{ $data->perPage() == 16 ? 'selected': ''}} value="16">默认</option>
<option {{ $data->perPage() == 20 ? 'selected': ''}} value="20">20</option>
<option {{ $data->perPage() == 50 ? 'selected': ''}} value="50">50</option>
<option {{ $data->perPage() == 100 ? 'selected': ''}} value="100">100</option>
</select>
<label class="text-center no-padding no-margin">条</label>
</div>
</span>
</li>
</ul>
{{--
@include('admin.widget.paginate-jump', [
'data' => 'data',
<!-- 'id' => 'customPage', -->
<!-- 'name' => 'page', -->
'formId' => 'formId',
])
--}}
<script src="/assets/libs/single_file/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
// 页面跳转
$('#{{$id or "customPage"}}').blur(function(){
var jump_page = $(this).val();
if (jump_page > {{ $data->lastPage()}} || jump_page <= 0) {
$(this).val({{ $data->currentPage() }});
jump_page = {{ $data->currentPage() }};
}
$('#{{$formId}}').submit();
// var url = "{!! $data->url( $data->currentPage() ) !!}";
// var page_posite = url.indexOf('page=');
// var str = url.substr(0,page_posite) + 'page=' + jump_page;
// window.location.href = str;
// console.log(jump_page, url,page_posite,str )
});
// 每页显示条数
$('#perPage').change(function(){
var per_page = $(this).val();
console.log(per_page);
$('#{{$formId}}').submit();
})
});
</script>

Laravel 自定义分页、可以调整、显示数目的更多相关文章
- laravel自定义分页功能的实现:
laravel版本:5.5.. 执行命令: php artisan vendor:publish --tag=laravel-pagination 在到 resources/views/vendor/ ...
- laravel 自定义分页 offset 和 limit 的使用
laravel 本身有一个自带的快速分页方法 paginate,只需要传入每页显示多少条数据就可以 了,但是如果想使用自定义从哪里开始呢,这时候就可以使用offset 和 limit 的组合,offs ...
- Laravel自定义分页样式
<?php namespace App\Http\Controllers; use DB; use App\Http\Controllers\Controller; class UserCont ...
- [ Laravel 5.6 文档 ]laravel数据库操作分页(自定义分页实现和自定义分页样式)
简介 在其他框架中,分页可能是件非常痛苦的事,Laravel 让这件事变得简单.易于上手.Laravel 的分页器与查询构建器和 Eloquent ORM 集成在一起,并开箱提供方便的.易于使用的.基 ...
- Laravel 5.4---后端数据分页和前端显示分页结果
后端数据(Eloquent 模型)分页 事先建立好Eloquent 模型和Controller 还有 前台的View.可以参考我之前的文章:Laravel建站03--建立前台文章列表和文章详情 在co ...
- Android Launcher分析和修改11——自定义分页指示器(paged_view_indicator)
Android4.0的Launcher自带了一个简单的分页指示器,就是Hotseat上面那个线段,这个本质上是一个ImageView利用.9.png图片做,效果实在是不太美观,用测试人员的话,太丑了. ...
- 第三百一十四节,Django框架,自定义分页
第三百一十四节,Django框架,自定义分页 自定义分页模块 #!/usr/bin/env python #coding:utf-8 from django.utils.safestring impo ...
- 十二 Django框架,自定义分页
自定义分页模块 #!/usr/bin/env python #coding:utf-8 from django.utils.safestring import mark_safe #封装分页类模块 c ...
- django上课笔记2-视图CBV-ORM补充-Django的自带分页-Django的自定义分页
一.视图CBV 1.urls url(r'^login.html$', views.Login.as_view()), 2.views from django.views import View cl ...
随机推荐
- 细说ORM之Entity FrameWork系列(被替换)
一. 谈情怀 从第一次接触开发到现在(2018年),接近五年时间了,最初阶段连接数据库,使用的是[SQL语句+ADO.NET],那时候,什么存储过程.什么事务 统统不理解,生硬的将SQL语句传入SQL ...
- vue-if与vue-show的区别
两者都是动态显示DOM元素 不同点: 1.使用方式 v-if是根据后面数据的真假,来判断DOM的添加删除等操作 v-show只是在修改元素的css样式(display属性值) 2.实现过程 v ...
- CorelDrawX8安装时提示已安装另一个版本
(1)首先卸载VIsualC++ 2015 运行库. (2)如果有VisualC++ 2017运行库,卸载VisualC++2017运行库,即可.
- 20155324 2016-2017-2 《Java程序设计》第4周学习总结
20155324 2016-2017-2 <Java程序设计>第4周学习总结 教材学习内容总结 继承 面对对象中,子类继承父类,避免重复定义行为就使用继承.在Java中,继承时使用exte ...
- 利用ssh操控远程服务器
这里的”远程”操控的方法实际上也不是真正的远程.,這此操作方法主要是在一个局域网内远程操控电脑 (在一个路由器下).可以把它做成在互联网中的远程操控, 不过技术难度上加了一个等级, 如果你想是想人在公 ...
- select样式设计
举例: select { color: blue; /*去掉边框*/ border: none; outline: none; /*去掉箭头*/ -webkit-appearance: none; / ...
- ubuntu 18.04/18.10解决create-react-app:command not found问题
npm config set prefix /usr/local sudo npm install -g create-react-app create-react-app my-app
- es6解构赋值的高级技巧
1. 解构嵌套的对象,注意,这时p是模式,不是变量,因此不会被赋值.如果p也要作为变量赋值,可以写成下面这样. let obj = { p: [ 'Hello', { y: 'World' } ] } ...
- Mysql-5.7.20-winx64绿色版安装步骤
Mysql-5.7.20-winx64绿色版安装步骤 1. 下载 mysql-5.7.20-winx64.zip 2.解压 解压到指定目录: C:\AppDate\mysql-5.7.20-winx6 ...
- ssm框架所需jar包整理及各jar包的作用
以下是我目前新搭建的ssm项目的pom.xml 之后如果需要其他的话再加 <?xml version="1.0" encoding="UTF-8"?> ...