Skip to content

Include Columns

Table columns are controlled by the columns() method.

You can find this method is inside your PowerGrid file (e.g., DishTable.php).

WARNING

Before proceeding, check if you have Added the column in order to have it available for including.

Usage

To display a column to your table, include a new Column::add() in the columns() method.

Place your code inside the method's return [] statement.

You should always provide both title() and field(). View all Column Methods.

Example:

php
public function columns(): array
{
     return [
         Column::add()
             ->title('ID')
             ->field('id'),
        
         Column::add()
             ->title('Dish name')
             ->field('name')
             ->searchable(),
        
         Column::add()
             ->title('Price + taxes')
             ->field('price_after_taxes')
              ->sortable(),
      ];
}
public function columns(): array
{
     return [
         Column::add()
             ->title('ID')
             ->field('id'),
        
         Column::add()
             ->title('Dish name')
             ->field('name')
             ->searchable(),
        
         Column::add()
             ->title('Price + taxes')
             ->field('price_after_taxes')
              ->sortable(),
      ];
}

or using make() method

php
public function columns(): array
{
     return [
         Column::make(title: 'ID', field: 'id'),

         Column::make(title: 'Dish name', field: 'name')
            ->searchable(),

         Column::make(title: 'Price + taxes', field: 'price_after_taxes')
             ->sortable(),
  ];
}
public function columns(): array
{
     return [
         Column::make(title: 'ID', field: 'id'),

         Column::make(title: 'Dish name', field: 'name')
            ->searchable(),

         Column::make(title: 'Price + taxes', field: 'price_after_taxes')
             ->sortable(),
  ];
}

Column Methods

The methods below can be chained to the PowerComponents\LivewirePowerGrid\Column class.

add

Adds a new column to your PowerGrid Table.

Example:

php
Column::add()
Column::add()

title

  • Sets a title in the column header.
Parameter
(string) $string

Example:

php
Column::add()
    ->title('Price in EUR'),
Column::add()
    ->title('Price in EUR'),

TIP

You can translate your title using Laravel's translation strings feature.

TIP

The column title also accepts HTML input.

For example- if using a font icon package you can use this to insert icons instead of text.

php
    Column::add()
        ->title('<i class="fas fa-low-vision" title="Visibility"></i>')
    Column::add()
        ->title('<i class="fas fa-low-vision" title="Visibility"></i>')

Warning: Since column titles are unescaped HTML, you should not directly insert any inputs by users as it may be susceptible to XSS attacks. If you must put user input please escape user defined values using Laravel's e helper


placeholder

Parameter
(string) $placeholder

Example:

php
Column::add()
    ->placeholder('Placeholder Description'),
Column::add()
    ->placeholder('Placeholder Description'),

field

ParameterDescription
(string) $fielddatabase table field name or array field
(string) $dataFieldOptionally, you may pass a second parameter $dataField referring to the data source table and field. This is useful when you join tables and must maintain unique field names.

Example:

php
Column::add()
    ->field('price_formatted'),
Column::add()
    ->field('price_formatted'),

With dataField:

php
Column::add()
    ->field('category_name', 'categories.name'),
Column::add()
    ->field('category_name', 'categories.name'),

searchable

By default, columns are not included when searching with Search Input.

This method allows the column's content to be searched with this feature.

Example:

php
Column::add()
    ->searchable(),
Column::add()
    ->searchable(),

sortable

  • Adds a sort button to the column header.

Example:

php
Column::add()
    ->sortable(),
Column::add()
    ->sortable(),

WARNING

If your column fetches data via relationship, you must join the related table in your Datasource query.


hidden

  • Hides the column in your PowerGrid table.

Example:

php
Column::add()
    ->hidden(),
Column::add()
    ->hidden(),

The method accepts two boolean arguments: isHidden and isForceHidden. Both default to true.

isHidden: true allows you to hide a column in the grid. The column will not be rendered in the grid's table, but it will still be present in the underlying data. This means that the column's data will still be available for other purposes, such as sorting or filtering. Using isForceHidden: true the column be visually hidden in the grid, but it will also be excluded from the underlying data.

Example of hiding only in the grid:

php
Column::add()
    ->hidden( isHidden:true, isForceHidden:false ),
Column::add()
    ->hidden( isHidden:true, isForceHidden:false ),

visibleInExport

  • This method can be useful when you want a column to appear in the file but not at the web-page.
ParameterDescription
(bool) $visibleWhen true, the column when be included when using the export to file function.

Example:

php
Column::add()
    ->title('Postal envelope data')
    ->field('postal_data')
    ->hidden()
    ->visibleInExport(true),
Column::add()
    ->title('Postal envelope data')
    ->field('postal_data')
    ->hidden()
    ->visibleInExport(true),

headerAttribute

ParameterDescription
(string) $classHTML class
(string) $styleHTML style

Adds the class or style to the column header.

Example:

php
Column::add()
    ->headerAttribute('text-center', 'color:red')
Column::add()
    ->headerAttribute('text-center', 'color:red')

bodyAttribute

  • Adds the class or style to each table row in this column.
ParameterDescription
(string) $classHTML class
(string) $styleHTML style

Example:

php
Column::add()
    ->bodyAttribute('text-center', 'color:red')
Column::add()
    ->bodyAttribute('text-center', 'color:red')

contentClassField

  • Adds the contents of the specified database column to the Table Column content <span> CSS class attribute.
ParameterDescription
(string) $dataFieldDatabase Column

Example:

php
Column::add()
    ->contentClassField('status_class')
Column::add()
    ->contentClassField('status_class')

contentClasses

  • Adds the corresponding value of the key matching the column content in the provided array to the Table Column content <span> CSS class attribute.
ParameterDescription
(array,string) $contentClassesColumn content => CSS Class assignments

Example:

php
Column::add()
    ->contentClasses([
          'In Progress' => 'text-blue-600',
          'Completed' => 'text-green-600'
     ])
Column::add()
    ->contentClasses([
          'In Progress' => 'text-blue-600',
          'Completed' => 'text-green-600'
     ])

You can add CSS classes to the span attribute.

php
Column::add()
    ->contentClasses('text-blue-600')
Column::add()
    ->contentClasses('text-blue-600')

Created By Luan Freitas and DanSysAnalyst