- Creating Columns
- Relationships
- Available Methods
- Other Column Types
- Column Selection
- Secondary Header
- Footer
- Reusable Columns
- Anonymous Columns
- Styling
- Standard Column
- Array Columns (beta)
- Avg Columns (beta)
- Boolean Columns
- Button Group Columns
- Color Columns
- Component Columns
- Count Columns (beta)
- Date Columns
- Icon Columns (beta)
- Image Columns
- Link Columns
- Livewire Component (beta)
- Sum Columns (beta)
- View Component Columns
- Wire Link Column (beta)
- Introduction
- Boolean Filters (beta)
- Date Filters
- DateRange Filters
- DateTime Filters
- Multi-Select Dropdown Filters
- Multi-Select Filters
- NumberRange Filters
- Number Filters
- Select Filters
- Text Filters
- Livewire Custom Filter (Beta)
- Refreshing
- Loading Placeholder
- Multiple Tables Same Page
- Actions (beta)
- Adding Custom Markup
- Debugging
- Saving Table State
- Lifecycle Hooks
- Hiding The Table (beta)
- One Of Many Example
- Tools
Getting Started
Usage
DataTable
Columns
Column Types
Rows
Sorting
Pagination
Search
Bulk Actions
Filters
Filter Types
Reordering
Secondary Header
Footer
Examples
Misc.
Sponsored
Advanced Usage
Examples
🎉 Enjoying this package? Consider sponsoring me on GitHub or buying me a beer.
This is the documentation for v3. You can switch versions in the menu on the left/at the top. Check your current version with the following command:
composer show rappasoft/laravel-livewire-tables
Rendering
Rendering Components
You render components the same way you render any Livewire component.
Your component at App\Livewire\UsersTable.php
1<livewire:users-table />
Theme
By default, all components will use the theme in the config file. But if for some reason you have different parts of your application using different frameworks, you can set the theme on a per-table basis:
1<livewire:users-table theme="bootstrap-4" />
Using sub-folders
If your component does not live in App\Livewire
, you can specify a different sub-folder. For example if your component lives in App\Livewire\Backend\Users
you would use the following:
1<livewire:backend.users.users-table />
Using non-standard locations
If for example you are using Domain Driven Development and you would like your component to live in App\Domains\Auth\Users
, then you would register your component in a service provider so Livewire knows how to find it.
For example in LivewireServiceProvider:
1use Livewire\Livewire;2use App\Domains\Auth\Users\UsersTable;3 4public function boot(): void5{6 Livewire::component('backend.users.users-table', UsersTable::class);7}
1<livewire:backend.users.users-table />
Passing Properties
Just like in standard Livewire components, you may pass properties and accept them in your mount method:
1<livewire:invoices-table status="open" />
1// Available as $this->status in datatable class or $status in views (if necessary)2public string $status;3 4// Optional, but if you need to initialize anything5public function mount(string $status): void {}