table filters dependent fields

[ainesophaur]

It would be awesome to bring in the magic of filament/forms special DI $get when creating table filters.

The use case would be to allow callbacks inside of $filter->options() to access other dependent form filter values using $get in the same way we can with filament/forms

Ive tried using custom filters but when using a Forms\Components\BelongsToSelect in the form combined with a relation, it errors out trying to call the relationship function on a null object (presumably because there is no $model bound to the form) Call to a member function ticketStatus() on null. I can achieve the desired result using regular Forms\Components\Select and manually creating the options etc. However, I feel there is more benefit to using BelongsToSelect over a regular Select. If we can bring the magic of $get to table filters then we're able to have a more consistent DX across both packages.

Below is some sample pseudo code that would be desired

//adding filters..
Tables\Filters\SelectFilter::make('ticket_board_id')
    ->relationship('ticketBoard', 'name')
    ->default(fn(?TicketBoard $record): bool => $record && $record->is_default)
    ->reactive(), //reactive doesn't exist with SelectFilter but does with form .. just pointing it out as a potential limitation

Tables\Filters\SelectFilter::make('ticket_priority_id')
    ->relationship('ticketPriority', 'name')
    ->options(function($get) {
        $board = $get('ticket_board_id');
        return empty($board) ? TicketPriority::all()->pluck('name', 'id') : TicketBoard::get($boards)->allAllowedPriorities()->pluck('name', 'id');
    }),

[danharrin]

You can pass a ->model() to any form component individually, even if the form doesn't have a model attached to it

All filters are reactive by default, which is why there is no reactive() method

Filters are not form components, which is why all the options are not available.

[3rgo]

Yeah that's what I did at first, using the documentation video.

But I'm using the AboveContent filter layout, and the custom form tries to fit the 2 fields in a single grid column, so they're horizontally compressed and take up more vertical space to wrap content. I tried adjusting the column span but it was ignored.

Since this was not very good looking I reverted and tried to hack my way through the filter classes...

[danharrin]

Can you send your filter form?

[3rgo]

This is my filter made using dependent selects

Filter::make('filter')
    ->form([
        Select::make('park_id')
            ->label('Park')
            ->options(
                Park::all()->pluck('display_name', 'id')->put(-1, 'None')->all()
            )
            ->reactive()
            ->afterStateUpdated(fn (callable $set) => $set('areas', null)),
        Select::make('areas')
            ->label('Areas')
            ->options(
                function (callable $get) {
                    if (filled($park_id = $get('park_id'))) {
                        $park = Park::find($park_id);
                        return $park->areas->pluck('name', 'id')->all();
                    } else {
                        return Area::all()->pluck('display_name', 'id')->all();
                    }
                }
            )
            ->reactive()
            ->afterStateUpdated(fn (callable $set) => $set('areas', null)),
    ])
    ->query(function (Builder $query, array $data): Builder {
        return $query
            ->when(
                $data['park_id'] === -1,
                fn (Builder $query): Builder => $query->whereNull('park_id'),
            );
    });

[akvaskov]

If your filters are dependant, its best to combine them into just one Filter with a custom form(). That way, you can still use $get like any normal form. You will have to handle the queries for both inputs within the query() method.

I have a form in a filter. Data from this filter form is used in query of the filter. It works ok but after filtering there is nothing in the active filters bar under the action toolbar. How to add filter settings there?

[jlafuentenunes]

This is my filter made using dependent selects

Filter::make('filter')
    ->form([
        Select::make('park_id')
            ->label('Park')
            ->options(
                Park::all()->pluck('display_name', 'id')->put(-1, 'None')->all()
            )
            ->reactive()
            ->afterStateUpdated(fn (callable $set) => $set('areas', null)),
        Select::make('areas')
            ->label('Areas')
            ->options(
                function (callable $get) {
                    if (filled($park_id = $get('park_id'))) {
                        $park = Park::find($park_id);
                        return $park->areas->pluck('name', 'id')->all();
                    } else {
                        return Area::all()->pluck('display_name', 'id')->all();
                    }
                }
            )
            ->reactive()
            ->afterStateUpdated(fn (callable $set) => $set('areas', null)),
    ])
    ->query(function (Builder $query, array $data): Builder {
        return $query
            ->when(
                $data['park_id'] === -1,
                fn (Builder $query): Builder => $query->whereNull('park_id'),
            );
    });

TOP NOTCH!!! What i was searching for. Big respect!!!

I'ved manage to resolve my problem this way:

->filters([

    Filter::make('filter')
        ->form([
            Select::make('clinic_id')
                ->label('Clinic')
                ->options(fn() => Clinic::pluck('name', 'id')->all())
                ->reactive()
                ->afterStateUpdated(fn(callable $set) => $set('doctor_id', null)),

            Select::make('doctor_id')
                ->label('Doctor')
                ->options(function (callable $get) {
                    $clinicId = $get('clinic_id');

                    if (!$clinicId) {
                        return [];
                    }

                    // Only doctors from the selected clinic
                    return User::whereHas('schedules', function (Builder $query) use ($clinicId) {
                        $query->where('clinic_id', $clinicId);
                    })
                        ->pluck('name', 'id')
                        ->all();
                })
                ->reactive(),
        ])
        ->query(function (Builder $query, array $data): Builder {
            // Apply clinic filter
            if (!empty($data['clinic_id'])) {
                $query->where('clinic_id', $data['clinic_id']);
            }

            // Apply doctor filter
            if (!empty($data['doctor_id'])) {
                $query->where('doctor_id', $data['doctor_id']);
            }

            return $query;
        }),

    Tables\Filters\SelectFilter::make('status')
        ->label('Status')
        ->options(AppointmentStatus::class),

    // Date filter
    Tables\Filters\Filter::make('start_time')
        ->label('Appointment Date')
        ->form([
            Forms\Components\DatePicker::make('date_from')->label('From'),
            Forms\Components\DatePicker::make('date_to')->label('To'),
        ])
        ->query(function (Builder $query, array $data) {
            // If the user interacted with the DatePicker, these values are here:
            $uiFrom = $data['date_from'] ?? null;
            $uiTo   = $data['date_to'] ?? null;

            // If the user filled in the UI, completely ignore inherited card values
            if ($uiFrom || $uiTo) {
                if ($uiFrom) {
                    $query->where('start_time', '>=', Carbon::parse($uiFrom)->startOfDay());
                }
                if ($uiTo) {
                    $query->where('start_time', '<=', Carbon::parse($uiTo)->endOfDay());
                }
                return;
            }

            // Otherwise, follow the card payload (query string)
            $payload = $data['data'] ?? [];
            $cardFrom = $payload['date_from'] ?? null;
            $cardTo   = $payload['date_to'] ?? null;

            if ($cardFrom) {
                $query->where('start_time', '>=', Carbon::parse($cardFrom)->startOfDay());
            }
            if ($cardTo) {
                $query->where('start_time', '<=', Carbon::parse($cardTo)->endOfDay());
            }
        })
        ->indicateUsing(function (array $data): ?string {
            $uiFrom = $data['date_from'] ?? null;
            $uiTo   = $data['date_to'] ?? null;

            // UI takes priority
            if ($uiFrom || $uiTo) {
                if ($uiFrom && $uiTo) {
                    return 'Between ' . $uiFrom . ' and ' . $uiTo;
                }
                if ($uiFrom) {
                    return 'From ' . $uiFrom;
                }
                if ($uiTo) {
                    return 'Until ' . $uiTo;
                }
            }

            // Indicator coming from the card
            $payload = $data['data'] ?? [];
            $cardFrom = $payload['date_from'] ?? null;
            $cardTo   = $payload['date_to'] ?? null;

            if ($cardFrom && $cardTo) {
                return 'Between ' . substr($cardFrom, 0, 10) . ' and ' . substr($cardTo, 0, 10);
            }
            if ($cardFrom) {
                return 'From ' . substr($cardFrom, 0, 10);
            }
            if ($cardTo) {
                return 'Until ' . substr($cardTo, 0, 10);
            }

            return null;
        })

])

    
    Your code helped me find my solution. Thank's.