laravel blade模板 使用layui动态分页效果

laravel 使用layui分页
参考

 {{$data->links('layouts.paginate')}}

创建文件
resources/views/layouts/paginate.blade.php

文件内容如下

@if ($paginator->hasPages())
    <div id="layui-table-page1">
        <div class="layui-box layui-laypage layui-laypage-default" id="layui-laypage-19">
            @if ($paginator->onFirstPage())
                <a href="javascript:;" class="layui-laypage-prev layui-disabled" data-page="12"><i class="layui-icon"></i></a>
            @else
                <a href="{{ $paginator->previousPageUrl() }}" class="layui-laypage-prev"><i class="layui-icon"></i></a>
            @endif
            {{-- Pagination Elements --}}
            @foreach ($elements as $element)
                {{-- "Three Dots" Separator --}}
                @if (is_string($element))
                    <span class="layui-laypage-spr">{{ $element }}</span>
                @endif
                {{-- 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 }}">{{ $page }}</a>
                        @endif
                    @endforeach
                @endif
            @endforeach
            @if ($paginator->hasMorePages())
                <a href="{{ $paginator->nextPageUrl() }}" class="layui-laypage-next"><i class="layui-icon"></i></a>
            @else
                <a href="javascript:;" class="layui-laypage-next layui-disabled" data-page="14"><i class="layui-icon"></i></a>
            @endif
            <span class="layui-laypage-skip">
                <form method="get" class="layui-laypage-skip" action="">
               //拿到所有参数,重构表单
                    <?php $query = request()->all(); ?>
                    @if(is_array($query))
                        @foreach ($query as $pa => $va)
                            @if($pa != 'page')
                                <input type="hidden" name="{{$pa}}" value="{{$va}}" />
                            @endif
                        @endforeach
                    @endif
                    //添加两个查询条件
                    跳到第<input name="page" type="number" min="1" value="{{ $paginator->currentPage() }}" class="layui-input">页
                    每页<input name="limit" type="number" min="1" value="{{ $paginator->perPage() }}" class="layui-input"><button type="submit" class="layui-laypage-btn">确定</button>
                </form>
            </span>
            <span class="layui-laypage-count">{{$paginator->total()}}</span>
        </div>
    </div>
@endif

效果图

在这里插入图片描述

解决思路

使用参数重构表单,再添加page和limit参数,也有人用input的form属性来解决,但ie不支持input的form属性

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值