Filament•9mo ago

any way to customize validationMessages for a checkbox?

                Checkbox::make('has_agreed_to_tos')
                    ->accepted()
                    ->required()
                    ->label(fn () => new HtmlString('I agree to the <a href="#"  target="_blank" class="fi-link group/link relative inline-flex items-center justify-center outline-none fi-size-md fi-link-size-md text-sky-500 text-underline">Terms & Conditions</a> and <a href="#" target="_blank" class="fi-link group/link relative inline-flex items-center justify-center outline-none fi-size-md fi-link-size-md text-sky-500 text-underline">Privacy Policy</a>'))
                    ->validationMessages([
                        'accepted' => 'You must agree to the terms and conditions to continue.',
                        'required' => 'test'
                    ])
            ])

                Checkbox::make('has_agreed_to_tos')
                    ->accepted()
                    ->required()
                    ->label(fn () => new HtmlString('I agree to the <a href="#"  target="_blank" class="fi-link group/link relative inline-flex items-center justify-center outline-none fi-size-md fi-link-size-md text-sky-500 text-underline">Terms & Conditions</a> and <a href="#" target="_blank" class="fi-link group/link relative inline-flex items-center justify-center outline-none fi-size-md fi-link-size-md text-sky-500 text-underline">Privacy Policy</a>'))
                    ->validationMessages([
                        'accepted' => 'You must agree to the terms and conditions to continue.',
                        'required' => 'test'
                    ])
            ])

tried both required and accepted separately and together and it always posts the entire content of the label attribute as the error message on the UI, which is obviously not great. Maybe using label isn't the right approach?

Solution:

remove $this->validate();

Jump to solution

11 Replies

Jon MasonOP•9mo ago

MohamedSabil83•9mo ago

Tried your code and works as expected for accepted. For required, the browser itself display a tooltip to check Also, for checkbox, when use accepted validation, no needs to use required

Jon MasonOP•9mo ago

Right, I get that, as I mentioned, I've tried it both ways. What I'm after is to be able to have a custom message for "accepted" validation that would just say "you must agree to the TOS", not the entire html string. The validation is working fine, but from a UX perspective, it's not great to show the entire html string as the error message. (see screenshot)

MohamedSabil83•9mo ago

Usually label is simple, e.g. Name, and for that the message will be Name is required. A customize label like your code need a custom validation message to prevent take that from label

LeandroFerreira•9mo ago

Did you add $this->form->fill() in the mount method?

Jon MasonOP•9mo ago

yep, everything is working from a validation perspective, it just doesn't have validation messages. I was looking at the source code and it looks like a checkbox is a totally separate trait from the CanBeValidated one. The Toggle input seems to have both the CanBeAccepted as well as the CanBeValidated, but even still, the "accepted" validation message doesn't work with toggle either. I'm just using a very simple label and then another placeholder field for the links so that I can get past it, but I still don't love it. The validation message just feels clunky.

LeandroFerreira•9mo ago

Could you share the whole code please?

Jon MasonOP•9mo ago

message.txt

Solution

LeandroFerreira•9mo ago

remove $this->validate();

Jon MasonOP•9mo ago

ahhh that worked! I don't understand why, but it worked.. THANK YOU!!!

Jon MasonOP•9mo ago

Also, thanks for the ApexCharts plugin...love it.

Gaming

Programming

any way to customize validationMessages for a checkbox?

Did you find this page helpful?