08 - Table Filters for Select and Dates

Text Version of the Lesson

Now let's return to our tables and see how to filter the data. You have already seen the searchable() for columns, but we can add a more complex global filter.

Remember, in the ProductResource, we have this array empty by default:

app/Filament/Resources/ProductResource.php:

return $table
    ->columns([
        // ...
    ])
    ->filters([
        // <- THIS ONE
    ])

It's time to fill it in!

You can define the filters that would appear in the top-right corner of the table.

The most simple example provided in the docs would render a checkbox filter:

->filters([
    Tables\Filters\Filter::make('is_featured')
        ->query(fn (Builder $query): Builder => $query->where('is_featured', true))
])

You need to provide a query that would filter by that checkbox.

But in our case, we don't have a checkbox field. We have Product status with three possible options. For this case...

The Full Lesson is Only for Premium Members

Want to access all of our courses? (36 h 00 min)

You also get:

61 courses

Premium tutorials

Access to repositories

Private Discord

Get Premium for $129/year or $29/month

Already a member? Login here

justgkp 2 years ago

Thanks...Very helpful!

Caspar Bisschop 2 years ago

So happy with these examples

magic-thomas 2 years ago

Thanks for very clean explanation.

novobyte 2 years ago

thanks for this examples. I have a question: if i set a date filter, the filter counter doesn't increase, and the label isn't displayed in the applied filters list: as if the filter isn't active. Why could this be happening? Is it a bug?

Povilas Korop 2 years ago

Hard to say, never happened to me, can't answer without debugging your specific situation.

novobyte 2 years ago

Now I use, and I suggest you, the "malzariey/filament-daterangepicker-filter" package: it is compatible with filament v3, and it is a nice solution for range of dates. I uses "->withIndicator()" function to write selected range date to enabled filters bar

Roman Zelenin 2 years ago

Filter::make('created_from')
    ->form([DatePicker::make('created_from')])
    // ...
    ->indicateUsing(function (array $data): ?string {
        if (! $data['created_from']) {
            return null;
        }
 
        return 'Created from ' . Carbon::parse($data['created_from'])->toFormattedDateString();
    }),

👍 2

Vignesh M 2 years ago

This is my filter code in user resource

->filters([ Tables\Filters\SelectFilter::make('roles') ->relationship(name: 'roles', titleAttribute: 'name') ->getOptionLabelFromRecordUsing(fn (Model $role) => self::transformToUpperCase($role->name)) ->native(false) ->multiple() ->preload(), ])

i have a function to transform string

protected static function transformToUpperCase($subject): string { return ucwords(str_replace(search: ['_', '-'], replace: ' ', subject: $subject)); }

But the label is not showing properly in active filters labels

Active filters Roles: dealer & test

Table Filters for Select and Dates

Text Version of the Lesson

The Full Lesson is Only for Premium Members

We'd Love Your Feedback

Thank You!