livewire-select
livewire-select copied to clipboard
fix cascading livewire select inputs nulled after repainting
The Problem:
As mentioned in #18 currently while executing the render method all livewire-select component values, which have dependencies, are nulled.
Assuming the following components the car-brand-select
would indeed show up with the right (visible) value, but car-model-select
would not only have no value, but it would also have no options (because car-brand-select
value is actually null
)
<livewire:car-brand-select
name="car_brand_id"
:value="$initialValue" // optional
placeholder="Choose a Car Brand" // optional
/>
<livewire:car-model-select
name="car_model_id"
placeholder="Choose a Car Model"
:depends-on="['car_brand_id']"
/>
Solution:
I have added a new property to the livewire component, called initValueEncoded
, this value is set on mount the same as the value
prop, but json encoded.
why json? Refering to another pull request of mine (#37), it is mandatory that also an array of values can be submitted.
Inside the select.blade.json the value
Livewire property can now be set during component initialization:
<div x-init="$wire.set('value', {{ $initValueEncoded }})">
(closes #18)