making one filter disappear when another is active

[prescriptionlifeline]

I have two filters in my CRUD:

        CRUD::filter('unpaid')
            ->type('simple')
            ->whenActive(function() {
                CRUD::addClause('unpaid');
            })->else(function() {
                CRUD::addClause('paid');
            });
        CRUD::filter('paid_online')
            ->type('simple')
            ->whenActive(function() {
                CRUD::addClause('paidOnline');
                //CRUD::filter('unpaid')->remove();
            });

Here are the relevant methods in the model that correspond to the addClause calls:

    public function scopePaid(Builder $query): void
    {
        $query->whereNotNull('datePaid');
    }

    public function scopeUnpaid(Builder $query): void
    {
        $query->whereNull('datePaid');
    }

    public function scopePaidOnline(Builder $query): void
    {
        $query->whereNotNull('paypalID');
    }

The thing is... it doesn't make sense to even show a filter for "paid online" when the "unpaid" filter is active. Like if you've paid online you've implicitly paid. By that same logic it also doesn't make sense to show the "paid online" filter when the "unpaid" filter is active.

Any ideas as to how I can make one filter disappear when another is active? I tried adding CRUD::filter('unpaid')->remove(); to the whenActive() anonymous function but that didn't do the trick.

[backpack-ai-bot[bot]]

To make one filter disappear when another is active, you can use the remove() method, but you need to apply it in a different way. Here's how you can achieve this:

CRUD::filter('unpaid')
    ->type('simple')
    ->whenActive(function() {
        CRUD::addClause('unpaid');
        CRUD::filter('paid_online')->remove();
    })->else(function() {
        CRUD::addClause('paid');
    });

CRUD::filter('paid_online')
    ->type('simple')
    ->whenActive(function() {
        CRUD::addClause('paidOnline');
        CRUD::filter('unpaid')->remove();
    });

In this solution, we're using the remove() method within the whenActive() function of each filter. This ensures that when one filter is active, it removes the other filter.

Here's what's happening:

1. When the 'unpaid' filter is active, it removes the 'paid_online' filter.
2. When the 'paid_online' filter is active, it removes the 'unpaid' filter.

This approach should make one filter disappear when the other is active, as you requested.

The reason your original attempt didn't work is that the remove() method needs to be called when the filter is actually being applied, not just when it's defined.

For more information on filter methods and how to manipulate them, you can refer to the Backpack CRUD API Cheat Sheet and the Backpack Fluent Syntax documentation.

ℹ️ Please note our AI Bot does not reply to follow-ups, this will be the only AI answer in this thread. If the AI helped you find the answer, please mark it as answered or write details below so it can learn. Then close the conversation. If not, please give more information for when a human reads this. ℹ️

Relevant sources:

CRUD Fluent API|Other Chained Methods
Filters PRO|Filters PRO
CRUD API Cheat Sheet|Filters
CRUD API|Filters
Github Issue (closed): [Filters] Make hidden filters
Github Issue (closed): [Bug] Remove filter button does not hide when select2 filters are cleared.
Github Issue (closed): BadMethodCallException on simple filter
Github Issue (closed): Extended Crud Classes - Filtering does not work
Github Issue (closed): Filter 'active' by default?
Github Issue (closed): [Bug] Clear Filters doesn't reset 'setModel'

[karandatwani92]

Hey @prescriptionlifeline

The filters works on ajax and they can't be removed without page reload.

For now, you can use dropdown or select2 filter in your use case, so one status is selected at a time.
For example:

CRUD::filter('status')
    ->type('dropdown')
    ->values([
        'unpaid' => 'unpaid',
        'paidOnline' => 'paidOnline',
    ])
    ->whenActive(function ($value) {
        CRUD::addClause('where', 'status', $value);
    });