How to have live and reactive SelectFilter class in Laravel Filament filter method of table builder

43 Views Asked by At

I'm encountering a limitation in Laravel Filament 3.x where using SelectFilter within a mobile number resource table requires a page reload to reflect filtered results. This disrupts the user experience.

I aim to achieve live and reactive filtering, similar to how the global search functionality works. I've explored the following approaches, but I'm seeking insights and potential refinements:

  1. My migration:
Schema::create('mobile_numbers', function (Blueprint $table) {
            $table->id();

            $table->unsignedBigInteger('customer_id')->nullable();
            $table->unsignedBigInteger('super_visor_id')->nullable();

            $table->foreign('customer_id')->references('id')->on('customers')->onDelete('cascade');
            $table->foreign('super_visor_id')->references('id')->on('super_visors')->onDelete('cascade');

            $table->string('mobile_number')->unique();
            $table->boolean('is_default')->default(1);

            $table->enum('type', ['customer', 'super_visor']);

            $table->timestamps();
        });
  1. And here is my filter method of table builder of mobile number resource:
 ->filters([
                Filter::make('is_default')
                    ->query(fn (Builder $query): Builder => $query->where('is_default', 1)),

                SelectFilter::make('type')
                    ->options([
                        'customer' => 'Customer',
                        'super_visor' => 'SuperVisor',
                    ])->native(false),

            ])
  1. My MobileNumberResource page: table builder image

I initially used Filament's default SelectFilter within my mobile number resource table. I expected selecting a value from the 'type' filter to immediately update the table with filtered results, similar to the global search functionality. However, the current behavior requires a page reload to display the filtered data.

0

There are 0 best solutions below