F
Filament•4mo ago
demonshide

How to Implement Pagination in ViewRecord Page with Custom View?

Hello, I'm trying to add pagination to a custom view in Filament. Here's my current setup: 1. File Location: - Resource: app/Filament/Resources/TrabajoResource/Pages/ViewTrabajo.php - Custom View: resources/views/filament/resources/trabajo/view.blade.php 2. Current Code: 
class ViewTrabajo extends ViewRecord {
  protected static string $resource = TrabajoResource::class;
  public function getViewData(): array {
    $trabajo = $this->record;
    return ['trabajo' => $trabajo, 'evidencias' => $trabajo->evidencias()->paginate(6)];
  }
  public function getView(): string {
    return 'filament.resources.trabajo.view';
  }
}
class ViewTrabajo extends ViewRecord {
  protected static string $resource = TrabajoResource::class;
  public function getViewData(): array {
    $trabajo = $this->record;
    return ['trabajo' => $trabajo, 'evidencias' => $trabajo->evidencias()->paginate(6)];
  }
  public function getView(): string {
    return 'filament.resources.trabajo.view';
  }
}
3. View Implementation: 
<x-filament::page>
  @if ($evidencias->isNotEmpty())
    @foreach ($evidencias as $evidencia)
      {{-- Content --}}
    @endforeach
    {{-- Pagination attempts --}}
  @else
    {{-- Empty state --}}
  @endif
</x-filament::page>
<x-filament::page>
  @if ($evidencias->isNotEmpty())
    @foreach ($evidencias as $evidencia)
      {{-- Content --}}
    @endforeach
    {{-- Pagination attempts --}}
  @else
    {{-- Empty state --}}
  @endif
</x-filament::page>
Issues I'm Facing: 1. First Attempt (Standard Pagination): - Using {{ $evidencias->links() }} works functionally - Issues: - Design doesn't match Filament's style - Full page refreshes cause scroll jumps 2. Second Attempt (Filament Pagination Component): - Using <x-filament::pagination :paginator="$evidencias" extreme-links />: - Pros: Perfect design match with Filament - Errors: Throws Livewire errors when clicking: 
Livewire\Exceptions\MethodNotFoundException PHP 8.1.32 10.48.29
Unable to call component method. Public method [gotoPage] not found on component
Unable to call component method. Public method [previousPage] not found on component
Livewire\Exceptions\MethodNotFoundException PHP 8.1.32 10.48.29
Unable to call component method. Public method [gotoPage] not found on component
Unable to call component method. Public method [previousPage] not found on component
How can I implement pagination in a ViewRecord page that: - Uses Filament's styled pagination component - Properly handles page navigation without Livewire errors - Maintains smooth UX without full page refreshes? I've checked the Filament Pagination docs but they seem focused on component. Thank you in advance for your help
Pagination Blade component - Core Concepts - Filament
1 Reply
Dennis Koch
Dennis Koch•4mo ago
I think those docs are a good start. Additionally check the source code of the component. It seems to require some methods on the component. The ListPage implements them via the CanPaginate trait. You can look there too, but need to implement them yourself, because those are related to a table.

Did you find this page helpful?