Add tooltip to table header column macro

By: dissto

Published: 25 Apr 2024 Updated: 04 May 2024

Add tooltip to table header column macro

In any service providers boot method add:

1TextColumn::macro('abbr', function (?string $abbr = null, bool $asTooltip = false) {
2	$label = $this->getLabel();
3	$abbr = $abbr ?? $label;
4	$classes = $this->isSortable() ? 'cursor-pointer' : 'cursor-help';
5
6	$attributes = $asTooltip ? 'x-tooltip.raw="'.$abbr.'" title=""' : 'title="'.$abbr.'"';
7
8	return $this->label(new HtmlString("<abbr class=\"$classes\" $attributes>$label</abbr>"));
9});

1TextColumn::make('amount')
2	->label('TA BT')
3	->abbr('the amount of money that was transferred before tax', asTooltip: true)

You may want to add 'cursor-help' to your safelist in your tailwind.config.js

1safelist: [
2	'cursor-help',
3],

Back to Tricks

Using an editable column like SelectColumn or ToggleColumn, you can conditionally trigger a modal form when a certain option is selected.

Globally Translate all Components

make all Field or any components translatable

Implementing Row-Level Security in Filament Tables with applyRowAccessPolicy

Learn how to implement row-level security in Filament tables using the applyRowAccessPolicy macro that filters query results based on user permissions through Laravel's policy system.

Make Filament table Headers sticky using CSS

Demonstration of using a resource for multiple typical models

how to use a resource with multiple models