vahnmarty Posts - Answer Overflow

Topics

vahnmarty

•Created by vahnmarty on 3/24/2025 in #❓┊help

Reactivity doesn't work on the frontend when using CheckboxList

I have this checkbox list that has 4 options, and the last one says "None of the above". Here's the logic of the checkboxlist, if i selected 1-3 options, and then clicked the "none of the above", it should uncheck the options and only check the "none of the above". So if the current checked is "none of the above", and I selected the other 3 options, it should automatically uncheck the "none of the above". The code i made is already working, HOWEVER, it's only working on the backend, and not in the display. The $state (in the backend) has the correct values, but in the frontend/html-view, it's showing the wrong checkboxes.

CheckboxList::make('list')
    ->label('Question here (Check all that apply)')
    ->options([
        'A' => 'A',
        'B' => 'B',
        'C' => 'C',
        'None of the Above' => 'None of the Above',
    ])
    ->live()
    ->required()
    ->afterStateUpdated(function(Livewire $livewire, CheckboxList $component, Get $get, Set $set,  $old, $state){

        $noneString = 'None of the above';

        if (is_array($state)){

            if(in_array($noneString, $old)){
                $selected = array_diff($state, [$noneString]);
            }
            elseif(in_array($noneString, $state)){
                $selected = [$noneString];
            }

            $set($component->getStatePath(), $selected);

            /**
            
            WHAT'S THE CODE HERE? TO LIKE REFRESH THE FORM OR THIS FIELD.

            something like $livewire->refresh()?
            
            **/
        }


    })

CheckboxList::make('list')
    ->label('Question here (Check all that apply)')
    ->options([
        'A' => 'A',
        'B' => 'B',
        'C' => 'C',
        'None of the Above' => 'None of the Above',
    ])
    ->live()
    ->required()
    ->afterStateUpdated(function(Livewire $livewire, CheckboxList $component, Get $get, Set $set,  $old, $state){

        $noneString = 'None of the above';

        if (is_array($state)){

            if(in_array($noneString, $old)){
                $selected = array_diff($state, [$noneString]);
            }
            elseif(in_array($noneString, $state)){
                $selected = [$noneString];
            }

            $set($component->getStatePath(), $selected);

            /**
            
            WHAT'S THE CODE HERE? TO LIKE REFRESH THE FORM OR THIS FIELD.

            something like $livewire->refresh()?
            
            **/
        }


    })

3 replies

•Created by vahnmarty on 3/24/2025 in #❓┊help

Method Filament\Forms\Components\CheckboxList::allowHtml does not exist.

It's literally on the docs https://filamentphp.com/docs/3.x/forms/fields/checkbox-list

use Filament\Forms\Components\CheckboxList;

CheckboxList::make('technology')
    ->options([
        'tailwind' => '<span class="text-blue-500">Tailwind</span>',
        'alpine' => '<span class="text-green-500">Alpine</span>',
        'laravel' => '<span class="text-red-500">Laravel</span>',
        'livewire' => '<span class="text-pink-500">Livewire</span>',
    ])
    ->searchable()
    ->allowHtml()

use Filament\Forms\Components\CheckboxList;

CheckboxList::make('technology')
    ->options([
        'tailwind' => '<span class="text-blue-500">Tailwind</span>',
        'alpine' => '<span class="text-green-500">Alpine</span>',
        'laravel' => '<span class="text-red-500">Laravel</span>',
        'livewire' => '<span class="text-pink-500">Livewire</span>',
    ])
    ->searchable()
    ->allowHtml()

5 replies

•Created by vahnmarty on 2/26/2025 in #❓┊help

Is Filament v3 compatible with Laravel 12?

Just recently installed laravel app version 12, using the livewire starter kit. And I noticed flux has been used. Upon installing filament table builder, i notice this

Filament uses Tailwind CSS v3 for styling. If your project uses Tailwind CSS v4, you will unfortunately need to downgrade it to v3 to use Filament. Filament v3 can't support Tailwind CSS v4 since it introduces breaking changes. Filament v4 will support Tailwind CSS v4.

I tried downgrading to tailwindcss3, and some of the UI I did already broke (as flux is existing in the project) So, should I downgrade to laravel 11?

11 replies

•Created by vahnmarty on 11/13/2024 in #❓┊help

Is there a field lifecycle for delete in FileUpload?

currently my fileupload is set to upload real time and creates a Model record using a model called "File", the ->afterStateUpdated is working for doing it. Now my question is what the code for deleting a file?

FileUpload::make('files'
    ->reactive()
    ->required()
    ->multiple()
    ->afterStateUpdated(function(FileUpload $component, Get $get, Set $set, $state){
        $component->saveUploadedFiles();
        $files = \Arr::flatten($component->getState());

        foreach($files as $singleFile){
            $fileRecord = File::create([
          
            ]);
        }

    }),

FileUpload::make('files'
    ->reactive()
    ->required()
    ->multiple()
    ->afterStateUpdated(function(FileUpload $component, Get $get, Set $set, $state){
        $component->saveUploadedFiles();
        $files = \Arr::flatten($component->getState());

        foreach($files as $singleFile){
            $fileRecord = File::create([
          
            ]);
        }

    }),

2 replies

•Created by vahnmarty on 9/5/2024 in #❓┊help

Filter with value having dash '-' is not properly working

I have a SelectFilter that uses a range format, e.g. Academic Year: 2025 - 2026, 2026 - 2027. When selecting a filter, the url parameter is like this ?tableFilters[academic_year_applying_for][value]=2025+–+2026 . So, it can't fetch query because of that +-+

4 replies

•Created by vahnmarty on 8/15/2024 in #❓┊help

How to get the clean state after using mask()?

By using afterStateUpdated, how to get the $state value as unmasked? Because In form when using $this->form->getState() the value gets cleaned.

TextInput::make('phone')
      ->placeholder('Phone Number')
      ->minLength(10)
      ->maxLength(14)
      ->afterStateUpdated(function (TextInput $component, $state){
          ..
      })
      ->mask('(999) 999-9999')
      ->numeric()
      ->required()
      ->stripCharacters(['(', ')', ' ', '-'])
      ->lazy()

TextInput::make('phone')
      ->placeholder('Phone Number')
      ->minLength(10)
      ->maxLength(14)
      ->afterStateUpdated(function (TextInput $component, $state){
          ..
      })
      ->mask('(999) 999-9999')
      ->numeric()
      ->required()
      ->stripCharacters(['(', ')', ' ', '-'])
      ->lazy()

3 replies

•Created by vahnmarty on 8/13/2024 in #❓┊help

Input Masking not rendering in Edit Mode

Look how I click the edit button then the phone is in normal mode, but when I click it , the phone format appears https://gyazo.com/9dbe855f09fa26c413aaeb7b96cbf368

2 replies

•Created by vahnmarty on 8/13/2024 in #❓┊help

How to reuse a Form Field?

In using a DRY principle, I want to use Phone input that can be use in all forms. Currently, I've been copy-pasting them accross pages.

TextInput::make('phone')
        ->disableLabel()
        ->label('Phone Number')
        ->placeholder('Phone Number')
        ->validationAttribute('Phone Number')
        ->minLength(10)
        ->maxLength(14)
        ->mask('(999) 999-9999')
        ->stripCharacters(['(', ')', ' ', '-'])
        ->numeric()
        ->rules([ new PhoneNumberRule, 'doesnt_start_with:1'])
        ->required()
        ->validationMessages([
            'doesnt_start_with' => 'Phone Number cannot begin with 1.',
        ]),

TextInput::make('phone')
        ->disableLabel()
        ->label('Phone Number')
        ->placeholder('Phone Number')
        ->validationAttribute('Phone Number')
        ->minLength(10)
        ->maxLength(14)
        ->mask('(999) 999-9999')
        ->stripCharacters(['(', ')', ' ', '-'])
        ->numeric()
        ->rules([ new PhoneNumberRule, 'doesnt_start_with:1'])
        ->required()
        ->validationMessages([
            'doesnt_start_with' => 'Phone Number cannot begin with 1.',
        ]),

So instead of this, is there a way I can use PhoneInput::make('primary_phone') ?

4 replies

•Created by vahnmarty on 8/11/2024 in #❓┊help

How to make TextInput to allow only numbers without using numeric()

Currently when using TextInput::numeric(), the input gonna be type="number"

TextInput::make('zipcode__c')
    ->label('ZIP Code ')
    ->minLength(4)
    ->maxLength(10)
    ->numeric()

TextInput::make('zipcode__c')
    ->label('ZIP Code ')
    ->minLength(4)
    ->maxLength(10)
    ->numeric()

By using numeric the minLength and maxLength no longer works. And it also allows decimal values.

4 replies

•Created by vahnmarty on 8/1/2024 in #❓┊help

How to access Model $record when using ->visible() or ->hidden()?

This is not working

TextColumn::make('email_verified')
    ->visible(fn(User $record) => $record->verified()),

TextColumn::make('email_verified')
    ->visible(fn(User $record) => $record->verified()),

i am getting this error:

App\Livewire\Portal\ManageUsers::App\Livewire\Portal\{closure}(): Argument #1 ($record) must be of type App\Models\User, null given, called in /Users/vahnmarty/Projects/mysi-v2/vendor/filament/support/src/Concerns/EvaluatesClosures.php on line 35

App\Livewire\Portal\ManageUsers::App\Livewire\Portal\{closure}(): Argument #1 ($record) must be of type App\Models\User, null given, called in /Users/vahnmarty/Projects/mysi-v2/vendor/filament/support/src/Concerns/EvaluatesClosures.php on line 35

12 replies

•Created by vahnmarty on 7/31/2024 in #❓┊help

How to apply <novalidate> to Action Modals

Sometimes I prefer to use the backend validations rather than the browser validations. Any idea idea how to insert novalidate to the <form> from Action modals?

7 replies

•Created by vahnmarty on 7/31/2024 in #❓┊help

Inserting html to validation message

Just wondering if this is already possible to filament v3? Currently I'm using Placeholder for this to work

Placeholder::make('email_message')
      ->disableLabel()
      ->content(new HtmlString('This email already exists. <a href="/forgot">Forgot password?</a>')),

Placeholder::make('email_message')
      ->disableLabel()
      ->content(new HtmlString('This email already exists. <a href="/forgot">Forgot password?</a>')),

Is there a way that a $fail can be html?

TextInput::make('email')
      ->label('')
      ->markAsRequired(false)
      ->validationAttribute('email')
      ->placeholder('Email address')
      ->lazy()
      ->autofocus()
      ->required()
      ->rules([
          fn (): Closure => function (string $attribute, $value, Closure $fail) {
              if (!User::where('email', $value)->exists()) {
                  $fail('This email does not exist from our records.');
              }
          },
      ]),

TextInput::make('email')
      ->label('')
      ->markAsRequired(false)
      ->validationAttribute('email')
      ->placeholder('Email address')
      ->lazy()
      ->autofocus()
      ->required()
      ->rules([
          fn (): Closure => function (string $attribute, $value, Closure $fail) {
              if (!User::where('email', $value)->exists()) {
                  $fail('This email does not exist from our records.');
              }
          },
      ]),

2 replies

•Created by vahnmarty on 5/7/2024 in #❓┊help

Is there an easy way to transform all labels to a different format instead of ucfirst (default) ?

I'm talking about everything that Filament has, from Panels to Forms to Tables. I've been using ->label() a lot because I prefer to have a Str::title() .

5 replies

•Created by vahnmarty on 4/11/2024 in #❓┊help

How to implement novalidate on Action (modal) ?

In vendor/filament/tables/resources/views/index.blade.php,

<form wire:submit.prevent="callMountedTableAction">
        @php
            $action = $getMountedAction();
        @endphp

<form wire:submit.prevent="callMountedTableAction">
        @php
            $action = $getMountedAction();
        @endphp

What's the way to add novalidate in the form tag?

2 replies

•Created by vahnmarty on 3/21/2024 in #❓┊help

Unable to upload images more than 2MB.

No description

3 replies

•Created by vahnmarty on 3/21/2024 in #❓┊help

sortable() in second-level relationship

Currently, this resource is using ApplicationStatus model.

Tables\Columns\TextColumn::make("application.student.first_name")
                    ->label("Student First Name")
                    ->searchable()
                    ->sortable(query: function (Builder $query, string $direction): Builder {
                        return $query->whereHas('application.student', function($sQuery) use ($direction) {
                            return $sQuery->orderBy('first_name', $direction);
                        });
                    }),

Tables\Columns\TextColumn::make("application.student.first_name")
                    ->label("Student First Name")
                    ->searchable()
                    ->sortable(query: function (Builder $query, string $direction): Builder {
                        return $query->whereHas('application.student', function($sQuery) use ($direction) {
                            return $sQuery->orderBy('first_name', $direction);
                        });
                    }),

Since the default sortable() is not working, so I had to customize the query to it. However, the one I made is not working.

3 replies

•Created by vahnmarty on 2/26/2024 in #❓┊help

Apply changes to field's sibling from Repeater

Using a column called is_primary_contact to a Parent model, I want to use $set() to apply changes to all of the parents. There can be only 1 primary contact, so If I set the parent1 to is_primary_contact, the rest of the parents should be false.

Select::make('is_primary_contact')
                        ->label('Is this parent the Primary Contact? (Only 1 parent can be the Primary Contact)')
                        ->options([
                            1 => 'Yes',
                            0 => 'No'
                        ])
                        ->required()
                        ->reactive()
                        ->afterStateUpdated(function(Closure $get, Closure $set, $state){

                            if($state == 1)
                            {   
                                $parentsRepeater = $get('../../parents');

                                foreach($parentsRepeater as $repeaterItemUuid => $parentItem)
                                {
                                    // How??
                                }
                            }
                            
                            $this->autoSaveParent($get('id'),'is_primary_contact', $state);
                        }),

Select::make('is_primary_contact')
                        ->label('Is this parent the Primary Contact? (Only 1 parent can be the Primary Contact)')
                        ->options([
                            1 => 'Yes',
                            0 => 'No'
                        ])
                        ->required()
                        ->reactive()
                        ->afterStateUpdated(function(Closure $get, Closure $set, $state){

                            if($state == 1)
                            {   
                                $parentsRepeater = $get('../../parents');

                                foreach($parentsRepeater as $repeaterItemUuid => $parentItem)
                                {
                                    // How??
                                }
                            }
                            
                            $this->autoSaveParent($get('id'),'is_primary_contact', $state);
                        }),

3 replies

•Created by vahnmarty on 2/13/2024 in #❓┊help

How to align TextInput to the right side?

No description

3 replies

•Created by vahnmarty on 9/19/2023 in #❓┊help

How to easily change the placeholder text on Search?

I want every resource will have different search placeholder, for example in Child Resource, the placeholder should be "Search First Name, Email or Phone Number". In Application Resource "Search Control Number, Status, Name".

10 replies

•Created by vahnmarty on 9/3/2023 in #❓┊help

Prevent Logout when changing Admin Password

I created a Page called Change Password, and the form is just this:

<?php

namespace App\Filament\Pages;

use Auth;
use Filament\Pages\Page;
use Filament\Facades\Filament;
use Illuminate\Support\HtmlString;
use Filament\Forms\Components\Grid;
use Filament\Forms\Contracts\HasForms;
use Filament\Notifications\Notification;
use Filament\Forms\Components\Placeholder;
use Phpsa\FilamentPasswordReveal\Password;
use App\Notifications\Admin\PasswordUpdated;
use Illuminate\Validation\ValidationException;
use Filament\Forms\Concerns\InteractsWithForms;
use Filament\Http\Responses\Auth\Contracts\LoginResponse;

class ChangePassword extends Page implements HasForms
{
    use InteractsWithForms;

    protected static ?string $navigationGroup = 'Settings';

    protected static ?string $navigationIcon = 'heroicon-o-key';

    protected static string $view = 'filament.pages.change-password';

    public $password, $password_confirmation;

    protected function getFormSchema() : array
    {
        return [
            Password::make('password')
                ->label('New Password')
                ->revealable()
                ->minLength(8)
                ->maxLength(16)
                ->required()
                ->confirmed(),
            Password::make('password_confirmation')
                ->label('Confirm Password')
                ->revealable()      
                ->required()
        ];
    }

    public function update()
    {
        $data = $this->form->getState();

        $user = Auth::user();
        $user->password = $data['password'];
        $user->save();

        $user->notify(new PasswordUpdated);

        return redirect('admin');
    }
}

<?php

namespace App\Filament\Pages;

use Auth;
use Filament\Pages\Page;
use Filament\Facades\Filament;
use Illuminate\Support\HtmlString;
use Filament\Forms\Components\Grid;
use Filament\Forms\Contracts\HasForms;
use Filament\Notifications\Notification;
use Filament\Forms\Components\Placeholder;
use Phpsa\FilamentPasswordReveal\Password;
use App\Notifications\Admin\PasswordUpdated;
use Illuminate\Validation\ValidationException;
use Filament\Forms\Concerns\InteractsWithForms;
use Filament\Http\Responses\Auth\Contracts\LoginResponse;

class ChangePassword extends Page implements HasForms
{
    use InteractsWithForms;

    protected static ?string $navigationGroup = 'Settings';

    protected static ?string $navigationIcon = 'heroicon-o-key';

    protected static string $view = 'filament.pages.change-password';

    public $password, $password_confirmation;

    protected function getFormSchema() : array
    {
        return [
            Password::make('password')
                ->label('New Password')
                ->revealable()
                ->minLength(8)
                ->maxLength(16)
                ->required()
                ->confirmed(),
            Password::make('password_confirmation')
                ->label('Confirm Password')
                ->revealable()      
                ->required()
        ];
    }

    public function update()
    {
        $data = $this->form->getState();

        $user = Auth::user();
        $user->password = $data['password'];
        $user->save();

        $user->notify(new PasswordUpdated);

        return redirect('admin');
    }
}

Also, Everytime I hit submit form, it redirects to /login and not /admin/login.

6 replies