Pagination not working as intended

I’ve built a user list page that uses pagination. I am using the WithPagination trait as per the documentation and using the default paginator:

{{ $users->links() }}

The links work as intended, I can navigate through the pages and there is no full page load. However, if I swap out and use a different view for the paginator:

`{{ $users->links('vendor.pagination.default') }}`

The pagination links are shown using the new view, and they allow me to navigate through the pages however, it does so using a full page reload. Is there anything special I need to do in the custom pagination view?

I’m using a vanilla Laravel 7 project, with the tailwindcss preset and latest version of livewire.

Any help guidance would be much appreciated.

The Livewire paginator behaves the same as the Laravel one - but it is not the same.

I styled the paginator with tailwind here

@brentvardy, this is what I did to avoid the full page reload :

  • I created a file called uikit_pagination.blade.php in the views\components folder (I’m using UIKit in my Laravel project) and I pasted in it the code written by Caleb : pagination-links.blade.php
  • I added the UIKit css classes for the pagination. You’ll have to add the tailwind css classes in your case.
  • Then you just have to call your component this way :
{{ $yourModel->links('components.your_pagination') }}

Hope it can help :slight_smile:

@Jean-Da-Rocha and @Snapey many thanks for your replies. I’m all sorted now with pagination that no longer makes a full page load. Much appreciated.

:green_heart:

1 Like

The problem can simply be solve by replacing all your href by wire:click
example with bootstrap pagination

[https://laravel-livewire.com/docs/2.x/pagination](http://)