박주니 개발 정리

라라벨 pagination을 의도한대로 만들고 싶다면? 본문

라라벨

라라벨 pagination을 의도한대로 만들고 싶다면?

박주니 2022. 3. 16. 16:13
728x90
반응형

바로 본론으로 들어가서 라라벨 paginate는 직접 조작할 수가 없습니다. 그럼 links()을 거치는 것이 아니라 ajax으로 직접 데이터를 받아서 아예 A-Z까지 사용해야하는 것인데 그럼 라라벨로 프론트를 구성할 때 비효율적이기 때문입니다. 

 

혹시 라라벨 paginate()을 활용해서 links()을 사용할 때 정해진 1-10까지 나오고 다음을 누르면 11-20 이렇게 나오게 하는 방법을 아시는 분은 알려주시면 감사하겠습니다. 저는 자바스크립트 및 react로 a-z까지 페이지네이션을 클라이언트가 요구한대로 만들어본 적은 있는데 라라벨은 공식 문서 및 전문가에게 물어봐도 알수가 없었습니다. 

 

  1. 'Pagination을 제대로 적용했는데 안된다면' 파트를 다 이행하셨다는 전제하에\Providers\AppServiceProvider.php로 접속해주시길 바랍니다.

  2. Paginator을 연결하고 useBootstrap()을 실행시킵니다.
    <?php
    
    namespace App\Providers;
    
    use Illuminate\Support\ServiceProvider;
    use Illuminate\Pagination\Paginator;
    class AppServiceProvider extends ServiceProvider
    {
        /**
         * Register any application services.
         *
         * @return void
         */
        public function register()
        {
            //
        }
    
        /**
         * Bootstrap any application services.
         *
         * @return void
         */
        public function boot()
        {
            Paginator::useBootstrap();
        }
    }
  • useBootstrap()을 사용하면 해당 pagination을 bootstrap pagination css을 적용시킵니다. 

3. 해당 url로 들어가서 pagination이 어떻게 bootstrap css가 사용되었는 지 확인합니다. 

주의사항)

web에서 진행할 때에는 10페이지를 초과했을 때 하단에 이미지처럼 ... 하고 마지막-1, 마지막페이지가 나오는 것을 볼 수 있습니다. 그런데 여기서 css로 ul.pagination을 width 및 margin, padding으로 간격을 조정할 수가 없기 때문에 크기를 줄여서 의도한 페이지네이션을 만들 수 없습니다. 

추가 진행했던 방법)

@if ($paginator->hasPages())

    <ul class="pagination">

        {{-- Previous Page Link --}}

        @if ($paginator->onFirstPage())

            <li class="disabled"><span>&laquo;</span></li>

        @else

            <li><a href="{{ $paginator->previousPageUrl() }}" rel="prev">&laquo;</a></li>

        @endif

 

        {{-- Pagination Elements --}}

        @foreach ($elements as $element)

            {{-- "Three Dots" Separator --}}

            @if (is_string($element))

                <li class="disabled"><span>{{ $element }}</span></li>

            @endif

 

            {{-- Array Of Links --}}

            @if (is_array($element))

                @foreach ($element as $page => $url)

                    @if ($page == $paginator->currentPage())

                        <li class="active"><span>{{ $page }}</span></li>

                    @else

                        <li><a href="{{ $url }}">{{ $page }}</a></li>

                    @endif

                @endforeach

            @endif

        @endforeach

 

        {{-- Next Page Link --}}

        @if ($paginator->hasMorePages())

            <li><a href="{{ $paginator->nextPageUrl() }}" rel="next">&raquo;</a></li>

        @else

            <li class="disabled"><span>&raquo;</span></li>

        @endif

    </ul>

@endif

라라벨 수동 페이지네이션을 적용해서 links()로 불러서 진행을 했지만 이 방법은 그저 controller에 적용할 paginate()와 동일한 역할이라는 것을 알게 되었고 조작을 하기에는 이미 존재하는 도구를 사용한 것이라 한계가 있었습니다. 

728x90
반응형
Comments