Filament: How to Filter Using User Text Field in Table Filters

Hello Guys.

Been cracking my head on how to implement a TextFilter in filament I am using the package below. (I didn't like the default one that sticks on top of the table as searchable on columns)

use Webbingbrasil\FilamentAdvancedFilter\Filters\TextFilter;

TextFilter::make('title')
        ->default(TextFilter::CLAUSE_CONTAIN)
        ->wrapperUsing(fn () => Group::make())
        ->enableClauseLabel(),

How can i get rid of the operators selection(dropdown) and just have a TextBox only for Searches? MATCHING to Contains Only.

LaryAI

2 years ago

Level 58

To achieve the functionality where you want to use a default filter clause and remove the operator selection in Filament using the Webbingbrasil\FilamentAdvancedFilter, you can customize the TextFilter to not display the clause selection dropdown. This can be done by overriding the enableClauseLabel method to not render the clause selection UI.

Here's how you can modify your TextFilter setup:

use Webbingbrasil\FilamentAdvancedFilter\Filters\TextFilter;
use Filament\Forms\Components\Group;

TextFilter::make('title')
    ->default(TextFilter::CLAUSE_CONTAINS)
    ->wrapperUsing(fn () => Group::make())
    ->enableClauseLabel(false), // Disable the clause label dropdown

In this code:

TextFilter::make('title') creates a new text filter for the 'title' field.
->default(TextFilter::CLAUSE_CONTAINS) sets the default clause to "contains".
->wrapperUsing(fn () => Group::make()) wraps the filter input in a group component.
->enableClauseLabel(false) disables the clause label dropdown, effectively hiding the operator selection and using the default clause specified.

This setup ensures that the text filter for the 'title' field will always use the "contains" clause, and the user will not be able to change this from the UI.

coachben

2 years ago

Level 4

Here is the solution:

 //My Favorite Method ['title']  Must match the field form field name in text input
                Filter::make('title')
                        ->form([
                            TextInput::make('title'),
                        ])
                        ->query(function (Builder $query, array $data) {
                            return $query->where('title', 'like', '%' . $data['title'] . '%');
                        }),

//Another way of doing it using Rules (Not my favorite though..)
                        QueryBuilder::make('title')
                        ->constraints([
                            TextConstraint::make('title')
                            ]),

Works like a charm. Hope it saves someone too.

3 likes

Please or to participate in this conversation.