Columns

Types of Columns

There are several column types available out of the box:

• TextColumn
• NumericColumn
• DateColumn
• DateTimeColumn
• BooleanColumn
• ActionColumn

Adding Columns

To add columns to your table, you can use the make method on the column class and pass the attribute of the Eloquent Model you want to display. Add the column to the array returned by the columns() method in your Table class.

TextColumn::make('name');

It will automatically generate a title-cased header based on the attribute name. If you want to customize the header, you can pass the header as the second argument.

TextColumn::make('name', 'Full Name');

The make() method has three additional arguments that you can use to customize the column, sortable, toggleable, searchable, and alignment. It is generally recommended to use named arguments for better readability.

TextColumn::make('name', 'Full Name', sortable: false, searchable: true, toggleable: true);

The alignment argument accepts the ColumnAlignment enum:

use InertiaUI\Table\Columns\ColumnAlignment;

TextColumn::make('total_amount', 'Total Amount', alignment: ColumnAlignment::Right);

Here are the default values for each argument:

Argument	Default Value
sortable	true
toggleable	false
searchable	false
alignment	ColumnAlignment::Left

Change the column properties with methods

Instead of passing the optional arguments to the make() method, you can use the methods provided by the column class to change the column properties. Note that the first argument, attribute, is required.

TextColumn::make('name')
    ->header('Full Name')
    ->sortable()
    ->notSortable()
    ->searchable()
    ->notSearchable()
    ->toggleable()
    ->notToggleable()
    ->align(ColumnAlignment::Right)
    ->leftAligned()
    ->centerAligned()
    ->rightAligned();

Boolean Column

The BooleanColumn class displays boolean values as Yes or No by default. You can customize the values by using the trueLabel and falseLabel methods.

BooleanColumn::make('is_active')
    ->trueLabel('Active')
    ->falseLabel('Inactive');

If you want to set a default label for all boolean columns, you can use the static setDefaultTrueLabel and setDefaultFalseLabel methods.

BooleanColumn::setDefaultTrueLabel('Absolutely');
BooleanColumn::setDefaultFalseLabel('Definitely Not');

Date Column

The DateColumn class is used to display date values. By default, it uses the Y-m-d format. You can customize the format by using the format method.

DateColumn::make('created_at')
    ->format('d/m/Y');

If you want to set a default format for all date columns, you can use the static setDefaultFormat method.

DateColumn::setDefaultFormat('d/m/Y');

Date Time Column

Just like the DateColumn class, the DateTimeColumn class has similar methods to customize the format.

DateTimeColumn::make('created_at')->format('d/m/Y H:i:s');
DateTimeColumn::setDefaultFormat('d/m/Y H:i:s');

Action Column

The ActionColumn class is used to add action buttons and links to the table. You can only have one ActionColumn in a table. Though it also has the make() method, there's also a static new() method that is recommended to use. You may pass the column header as the first argument.

ActionColumn::new('Actions');