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');
}
}