The Filament Record Navigation Plugin allows seamless navigation through records in a Filament resource's view. With this plugin, you can add "Next" and "Previous" buttons to navigate through records efficiently. It includes features like unsaved changes detection, browser history management, and proper URL updates.
Record.Nav.mp4
- Navigate between records with "Next" and "Previous" buttons
- Unsaved changes detection with confirmation dialog
- Browser history management for proper navigation state
- Seamless URL updates without page refresh
- Automatic relation managers refresh when navigating between records
- Support for Laravel 10, 11, and 12
- Compatible with Filament v3.x
composer require josespinal/filament-record-navigation
The package will automatically register itself.
After installation, you need to publish and build the Filament assets:
php artisan filament:assets
For production environments, make sure to run:
php artisan filament:assets --optimize
In your Filament resource's EditRecord
page, use the HasRecordNavigation
trait to add the navigation functionality. And add the action where you want, for example, the header with getHeaderActions
:
namespace App\Filament\Resources\PostResource\Pages;
use App\Filament\Resources\PostResource;
use Filament\Resources\Pages\EditRecord;
use JoseEspinal\RecordNavigation\Traits\HasRecordNavigation;
class EditPost extends EditRecord
{
use HasRecordNavigation;
protected static string $resource = PostResource::class;
protected function getHeaderActions(): array
{
return array_merge(parent::getActions(), $this->getNavigationActions());
}
}
If you have existing actions, merge them with the navigation actions, like so:
protected function getHeaderActions(): array
{
$existingActions = [
// Your existing actions here...
];
return array_merge($existingActions, $this->getNavigationActions());
}
In your resource's ListRecords
page, include the HasRecordsList
trait as follows:
namespace App\Filament\Resources\PostResource\Pages;
use App\Filament\Resources\PostResource;
use Filament\Resources\Pages\ListRecords;
use JoseEspinal\RecordNavigation\Traits\HasRecordsList;
class ListPosts extends ListRecords
{
use HasRecordsList;
protected static string $resource = PostResource::class;
}
To automatically refresh relation managers when navigating between records, use the HasRelationManagersWithRecordNavigation
trait in your relation managers:
namespace App\Filament\Resources\PostResource\RelationManagers;
use Filament\Resources\RelationManagers\RelationManager;
use JoseEspinal\RecordNavigation\Traits\HasRelationManagersWithRecordNavigation;
class CommentsRelationManager extends RelationManager
{
use HasRelationManagersWithRecordNavigation;
protected static string $relationship = 'comments';
// Rest of your relation manager code...
}
The plugin automatically detects unsaved changes in your forms and will prompt for confirmation before navigating away. This helps prevent accidental data loss when navigating between records.
No additional configuration is needed - this feature works out of the box.
By default, this uses Filament's translation key filament-panels::unsaved-changes-alert.body
. You can customize this message by publishing Filament's translations and modifying the corresponding translation string.
Remember to rebuild your assets after making changes.
The plugin uses modern browser features for enhanced navigation:
- History API for proper browser history management
- URL updates without page refresh
- Works with all modern browsers (Chrome, Firefox, Safari, Edge)
Please see CHANGELOG for more information on what has changed recently.
The MIT License (MIT). Please see License File for more information.