AlpineJS component on livewire

#1

Hi,

I am trying alpine livewire pickaday example but not data is returned on wire:model.

I have this blade component

<input  x-data  x-ref="input"  x-init="new Pikaday({ field: $refs.input })"  type="text"  {{ $attributes }} />

And this call on livewire component

                <x:date-ranger wire:model="temp_date" id="temp_date" />

            {{$temp_date}}

Javascript is working but no data is returned to {{$temp_date}}

Any idea?

1 Like
#2

I have the same issue, Iā€™m using Laravel 7 with livewire 1.2.0, alpinejs 2.3.5 and pikaday 1.8.0.

#3

I found the correct way,

Because its not an input or user typed element, we need to listen to the native event and that is why we need to add lazy to the binding.

<x:date-ranger wire:model.lazy="temp_date" id="temp_date" />

With that change it will work at least for me. :stuck_out_tongue: