Custom card Radio Button form field
Hi,
I have build a custom form field for displaying the radio button as a card with an image. Everything is working fine but I would like to add a border to the checked radio button.
I can't really figure out how to do it in the custom view. I know tailwind has some cool peer-checked options but I cannot get it working...
Does someone have a good idea how to solve this?
Thanks!
I have build a custom form field for displaying the radio button as a card with an image. Everything is working fine but I would like to add a border to the checked radio button.
I can't really figure out how to do it in the custom view. I know tailwind has some cool peer-checked options but I cannot get it working...
Does someone have a good idea how to solve this?
Thanks!
Solution
For others:
In your blade file you need to add this to your input field. So the state gets updated every time the user changes the input. This directly sends a request to the server everytime if ->live() is added.
<input {{ $applyStateBindingModifiers('wire:model') }}="{{ $getStatePath() }}" />
Also make sure to make the component ->live() in your resource.
Then you can add classes dynamically by checking $getState() and apply classes to it.
@if ($getState() == $value) border-2 border-green-500 @endif
In your blade file you need to add this to your input field. So the state gets updated every time the user changes the input. This directly sends a request to the server everytime if ->live() is added.
<input {{ $applyStateBindingModifiers('wire:model') }}="{{ $getStatePath() }}" />
Also make sure to make the component ->live() in your resource.
Then you can add classes dynamically by checking $getState() and apply classes to it.
@if ($getState() == $value) border-2 border-green-500 @endif
