Introduction
Column classes can be found in theFilament\Tables\Columns namespace. They reside within the $table->columns() method. Filament includes a number of columns built-in:
Editable columns allow the user to update data in the database without leaving the table:
You may also create your own custom columns to display data however you wish.
Columns may be created using the static make() method, passing its unique name. Usually, the name of a column corresponds to the name of an attribute on an Eloquent model. You may use “dot notation” to access attributes within relationships:
Column content (state)
Columns may feel a bit magic at first, but they’re designed to be simple to use and optimized to display data from an Eloquent record. Despite this, they’re flexible and you can display data from any source, not just an Eloquent record attribute. The data that a column displays is called its “state”. When using a panel resource, the table is aware of the records it is displaying. This means that the state of the column is set based on the value of the attribute on the record. For example, if the column is used in the table of aPostResource, then the title attribute value of the current post will be displayed.
Setting the state of a column
You can pass your own state to a column by using thestate() method:
The state() method also accepts a function to dynamically calculate the state. You can inject various utilities into the function as parameters.
state() method also accepts a function to dynamically calculate the state. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
Setting the default state of a column
When a column is empty (its state isnull), you can use the default() method to define alternative state to use instead. This method will treat the default state as if it were real, so columns like image or color will display the default image or color.
Adding placeholder text if a column is empty
Sometimes you may want to display placeholder text for columns with an empty state, which is styled as a lighter gray text. This differs from the default value, as the placeholder is always text and not treated as if it were real state.Displaying data from relationships
You may use “dot notation” to access columns within relationships. The name of the relationship comes first, followed by a period, followed by the name of the column to display:Counting relationships
If you wish to count the number of related records in a column, you may use thecounts() method:
users is the name of the relationship to count from. The name of the column must be users_count, as this is the convention that Laravel uses for storing the result.
If you’d like to scope the relationship before counting, you can pass an array to the method, where the key is the relationship name and the value is the function to scope the Eloquent query with:
Determining relationship existence
If you simply wish to indicate whether related records exist in a column, you may use theexists() method:
users is the name of the relationship to check for existence. The name of the column must be users_exists, as this is the convention that Laravel uses for storing the result.
If you’d like to scope the relationship before checking existence, you can pass an array to the method, where the key is the relationship name and the value is the function to scope the Eloquent query with:
Aggregating relationships
Filament provides several methods for aggregating a relationship field, includingavg(), max(), min() and sum(). For instance, if you wish to show the average of a field on all related records in a column, you may use the avg() method:
users is the name of the relationship, while age is the field that is being averaged. The name of the column must be users_avg_age, as this is the convention that Laravel uses for storing the result.
If you’d like to scope the relationship before aggregating, you can pass an array to the method, where the key is the relationship name and the value is the function to scope the Eloquent query with:
Setting a column’s label
By default, the label of the column, which is displayed in the header of the table, is generated from the name of the column. You may customize this using thelabel() method:
As well as allowing a static value, the label() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.
label() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
Sorting
Columns may be sortable, by clicking on the column label. To make a column sortable, you must use thesortable() method:
orderBy() clause to the Eloquent query. This is useful for simple cases where the column name matches the database column name. It can also handle relationships.
However, many columns are not as simple. The state of the column might be customized, or using an Eloquent accessor. In this case, you may need to customize the sorting behavior.
You can pass an array of real database columns in the table to sort the column with:
full_name column is not a real column in the database, but the first_name and last_name columns are. When the full_name column is sorted, Filament will sort the table by the first_name and last_name columns. The reason why two columns are passed is that if two records have the same first_name, the last_name will be used to sort them. If your use case doesn’t require this, you can pass only one column in the array if you wish.
You may also directly interact with the Eloquent query to customize how sorting is applied for that column:
The query parameter’s function can inject various utilities as parameters.
query parameter’s function can inject various utilities as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Direction
$direction
string
The direction that the column is currently being sorted on, either
'asc' or 'desc'.Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent query builder
$query
Illuminate\Database\Eloquent\Builder
The query builder to modify.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
Sorting by default
You may choose to sort a table by default if no other sort is applied. You can use thedefaultSort() method for this:
'asc'.
If you pass the name of a table column as the first parameter, Filament will use that column’s sorting behavior (custom sorting columns or query function). However, if you need to sort by a column that doesn’t exist in the table or in the database, you should pass a query function instead:
Persisting the sort in the user’s session
To persist the sorting in the user’s session, use thepersistSortInSession() method:
Setting a default sort option label
To set a default sort option label, use thedefaultSortOptionLabel() method:
Disabling default primary key sorting
By default, Filament will automatically add a primary key sort to the table query to ensure that the order of records is consistent. The primary key will be sorted in the same direction as the other sort column. If your table doesn’t have a primary key, or you wish to disable this behavior, you can use thedefaultKeySort(false) method:
Searching
Columns may be searchable by using the text input field in the top right of the table. To make a column searchable, you must use thesearchable() method:
where clause to the Eloquent query, searching for the column name. This is useful for simple cases where the column name matches the database column name. It can also handle relationships.
However, many columns are not as simple. The state of the column might be customized, or using an Eloquent accessor. In this case, you may need to customize the search behavior.
You can pass an array of real database columns in the table to search the column with:
full_name column is not a real column in the database, but the first_name and last_name columns are. When the full_name column is searched, Filament will search the table by the first_name and last_name columns.
You may also directly interact with the Eloquent query to customize how searching is applied for that column:
The query parameter’s function can inject various utilities as parameters.
query parameter’s function can inject various utilities as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent query builder
$query
Illuminate\Database\Eloquent\Builder
The query builder to modify.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
Search
$search
string
The current search input value.
Table
$table
Filament\Tables\Table
The current table instance.
Adding extra searchable columns to the table
You may allow the table to search with extra columns that aren’t present in the table by passing an array of column names to thesearchable() method:
Customizing the table search field placeholder
You may customize the placeholder in the search field using thesearchPlaceholder() method on the $table:
Searching individually
You can choose to enable a per-column search input field using theisIndividual parameter:
isIndividual parameter, you may still search that column using the main “global” search input field for the entire table.
To disable that functionality while still preserving the individual search functionality, you need the isGlobal parameter:
Customizing the table search debounce
You may customize the debounce time in all table search fields using thesearchDebounce() method on the $table. By default, it is set to 500ms:
Searching when the input is blurred
Instead of automatically reloading the table contents while the user is typing their search, which is affected by the debounce of the search field, you may change the behavior so that the table is only searched when the user blurs the input (tabs or clicks out of it), using thesearchOnBlur() method:
Persisting the search in the user’s session
To persist the table or individual column search in the user’s session, use thepersistSearchInSession() or persistColumnSearchInSession() method:
Disabling search term splitting
By default, the table search will split the search term into individual words and search for each word separately. This allows for more flexible search queries. However, it can have a negative impact on performance when large datasets are involved. You can disable this behavior using thesplitSearchTerms(false) method on the table:
Clickable cell content
When a cell is clicked, you may open a URL or trigger an “action”.Opening URLs
To open a URL, you may use theurl() method:
The url() method also accepts a function to dynamically calculate the value. You can inject various utilities into the function as parameters.
url() method also accepts a function to dynamically calculate the value. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
State
$state
mixed
The current value of the column, based on the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
Triggering actions
To run a function when a cell is clicked, you may use theaction() method. Each method accepts a $record parameter which you may use to customize the behavior of the action:
Action modals
You may open action modals by passing in anAction object to the action() method:
action() method must have a unique name to distinguish it from other actions within the table.
Preventing cells from being clicked
You may prevent a cell from being clicked by using thedisabledClick() method:
Adding a tooltip to a column
You may specify a tooltip to display when you hover over a cell:As well as allowing a static value, the tooltip() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.
tooltip() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
State
$state
mixed
The current value of the column, based on the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
Adding a header tooltip to a column
You may specify a tooltip to display when you hover over the column header:As well as allowing a static value, the headerTooltip() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.
headerTooltip() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
State
$state
mixed
The current value of the column, based on the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
Aligning column content
Horizontally aligning column content
You may align the content of an column to the start (left in left-to-right interfaces, right in right-to-left interfaces), center, or end (right in left-to-right interfaces, left in right-to-left interfaces) using thealignStart(), alignCenter() or alignEnd() methods:
Alignment enum to the alignment() method:
As well as allowing a static value, the alignment() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.
alignment() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
State
$state
mixed
The current value of the column, based on the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
Vertically aligning column content
You may align the content of a column to the start, center, or end using theverticallyAlignStart(), verticallyAlignCenter() or verticallyAlignEnd() methods:
VerticalAlignment enum to the verticalAlignment() method:
As well as allowing a static value, the verticalAlignment() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.
verticalAlignment() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
State
$state
mixed
The current value of the column, based on the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
Allowing column headers to wrap
By default, column headers will not wrap onto multiple lines if they need more space. You may allow them to wrap using thewrapHeader() method:
The wrapHeader() method also accepts a function to dynamically calculate the value. You can inject various utilities into the function as parameters.
wrapHeader() method also accepts a function to dynamically calculate the value. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
State
$state
mixed
The current value of the column, based on the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
Controlling the width of columns
By default, columns will take up as much space as they need. You may allow some columns to consume more space than others by using thegrow() method:
style attribute, so you can use any valid CSS value:
The width() method also accepts a function to dynamically calculate the value. You can inject various utilities into the function as parameters.
width() method also accepts a function to dynamically calculate the value. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
Grouping columns
You group multiple columns together underneath a single heading using aColumnGroup object:
ColumnGroup object. To improve the multi-line fluency of the API, you can chain the columns() onto the object instead of passing it as the second argument:
Hiding columns
You may hide a column by using thehidden() or visible() method:
Allowing users to manage columns
Toggling column visibility
Users may hide or show columns themselves in the table. To make a column toggleable, use thetoggleable() method:
Making toggleable columns hidden by default
By default, toggleable columns are visible. To make them hidden instead:Reordering columns
You may allow columns to be reordered in the table using thereorderableColumns() method:
Live column manager
By default, column manager changes (toggling and reordering columns) are deferred and do not affect the table, until the user clicks an “Apply” button. To disable this and make the filters “live” instead, use thedeferColumnManager(false) method:
Customizing the column manager dropdown trigger action
To customize the column manager dropdown trigger button, you may use thecolumnManagerTriggerAction() method, passing a closure that returns an action. All methods that are available to customize action trigger buttons can be used:
Displaying the reset action in the footer
By default, the reset action appears in the header of the column manager. You may move it to the footer, next to the apply action, using thecolumnManagerResetActionPosition() method:
Disabling column persistence in the user’s session
By default, Filament persists the table’s columns by storing them in the user’s session. To prevent persisting the columns in the user’s session, use thepersistColumnsInSession(false) method:
Changing the number of display columns in the column manager
By default, the column manager displays its options in a single column. You can increase this to multiple columns using thecolumnManagerColumns() method:
Adding extra HTML attributes to a column content
You can pass extra HTML attributes to the column content via theextraAttributes() method, which will be merged onto its outer HTML element. The attributes should be represented by an array, where the key is the attribute name and the value is the attribute value:
As well as allowing a static value, the extraAttributes() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.
extraAttributes() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
State
$state
mixed
The current value of the column, based on the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
extraAttributes() multiple times will overwrite the previous attributes. If you wish to merge the attributes instead, you can pass merge: true to the method.
Adding extra HTML attributes to the cell
You can also pass extra HTML attributes to the table cell which surrounds the content of the column:As well as allowing a static value, the extraCellAttributes() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.
extraCellAttributes() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
State
$state
mixed
The current value of the column, based on the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
extraCellAttributes() multiple times will overwrite the previous attributes. If you wish to merge the attributes instead, you can pass merge: true to the method.
Adding extra attributes to the header cell
You can pass extra HTML attributes to the table header cell which surrounds the content of the column:As well as allowing a static value, the extraHeaderAttributes() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.
extraHeaderAttributes() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.Learn more about utility injection.
Column
$column
Filament\Tables\Columns\Column
The current column instance.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current table row.
Row loop
$rowLoop
stdClass
The row loop object for the current table row.
State
$state
mixed
The current value of the column, based on the current table row.
Table
$table
Filament\Tables\Table
The current table instance.
extraHeaderAttributes() multiple times will overwrite the previous attributes. If you wish to merge the attributes instead, you can pass merge: true to the method.
Column utility injection
The vast majority of methods used to configure columns accept functions as parameters instead of hardcoded values:Injecting the current state of the column
If you wish to access the current value (state) of the column, define a$state parameter:
Injecting the current Eloquent record
You may retrieve the Eloquent record for the current schema using a$record parameter:
Injecting the row loop
To access the row loop object for the current table row, define a$rowLoop parameter:
Injecting the current Livewire component instance
If you wish to access the current Livewire component instance, define a$livewire parameter:
Injecting the current column instance
If you wish to access the current component instance, define a$component parameter:
Injecting the current table instance
If you wish to access the current table instance, define a$table parameter:
Injecting multiple utilities
The parameters are injected dynamically using reflection, so you’re able to combine multiple parameters in any order:Injecting dependencies from Laravel’s container
You may inject anything from Laravel’s container like normal, alongside utilities:Global settings
If you wish to change the default behavior of all columns globally, then you can call the staticconfigureUsing() method inside a service provider’s boot() method, to which you pass a Closure to modify the columns using. For example, if you wish to make all TextColumn columns toggleable(), you can do it like so: