Skip to main content

Resource Index Table

Customizing back-end table​

You can supply your own ResourceTable if necessary:

public function resourceTable(Request $request, string $name): ResourceTable
{
    return new TicketResourceTable($request, $this, $name);
}

Make sure that your custom table extends ResourceTable.

Table inline editing​

You may allow users to edit your resource from within the index table:

public function isEditableInsideTable(): bool
{
    return true;
}

You then have 2 options to make the edit form available to the user:

// By enabling a context menu when hovering over the row
public function hasTableContextMenu(): bool
{
    return true;
}
// By expanding a row when clicking on the table row
public function onTableRowClick(): string
{
    return TableContextMenu::EXPAND_ROW;
}

Table context menu​

When enabling the context menu:

 public function hasTableContextMenu(): bool
 {
     return true;
 }

You can add additional buttons, like an edit button:

 public function hasTableContextMenuEditButton(): bool
 {
     return $this->canUpdateAny();
 }

A detail button:

public function hasTableContextMenuDetailButton(): bool
{
    return $this->onTableRowClick() === TableContextMenu::EXPAND_ROW;
}

A delete button:

public function hasTableContextMenuDeleteButton(): bool
{
    return $this->canDeleteAny();
}

Table row on click​

When the user clicks on a row, you have 2 options:

 // Default: navigate to detail page
 public function onTableRowClick(): string
 {
     return TableContextMenu::NAVIGATE_TO_DETAIL;
 }
// Expand the row
public function onTableRowClick(): string
{
    return TableContextMenu::EXPAND_ROW;
}

Table sticky columns​

You can enable certain columns to scroll horizontally when you have a table with lots of columns:

For example, to make the first column sticky, add the following method to your resource:

public function stickyTableColumns(): array
{
    return [0];
}

You can also make multiple columns sticky:

public function stickyTableColumns(): array
{
    return [1,2];
}

Table row styling​

In some cases you always want to apply certain styles to a table row based on model conditions.

You can add the following method to your resource:

public function postProcessTableRow(TableDataStyler $styler, Model $model): void
{
    if ($model->amount >= 50) {
        $styler->setRowClass('bg-positive');
    }
}