Skip to content

fix cascading livewire select inputs nulled after repainting#39

Open
bfiessinger wants to merge 1 commit intoasantibanez:masterfrom
bfiessinger:fix/null-value-on-mount
Open

fix cascading livewire select inputs nulled after repainting#39
bfiessinger wants to merge 1 commit intoasantibanez:masterfrom
bfiessinger:fix/null-value-on-mount

Conversation

@bfiessinger
Copy link
Copy Markdown

@bfiessinger bfiessinger commented Aug 28, 2021

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)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

When dynamically adding livewire-select components to the page, options don't render

1 participant