Skip to content

Instantly share code, notes, and snippets.

@robbinbenard
Created December 4, 2024 16:47
Show Gist options
  • Save robbinbenard/5ce47b409228cd9fe1ab0aa2937c4d13 to your computer and use it in GitHub Desktop.
Save robbinbenard/5ce47b409228cd9fe1ab0aa2937c4d13 to your computer and use it in GitHub Desktop.
Livewire + Choices.js
@props([
'placeholder' => null,
])
<div
wire:ignore
x-data="{
value: $wire.entangle(@js($attributes->wire('model')->value)){{ $attributes->wire('model')->hasModifier('live') ? '.live' : '' }},
init () {
const choices = new Choices(this.$refs.select, {
placeholderValue: @js($placeholder)
})
choices.setChoiceByValue(this.value);
this.$refs.select.addEventListener('change', () => {
this.value = choices.getValue(true);
})
},
}"
>
<select x-ref="select" {{ $attributes->only('multiple') }}>
{{ $slot }}
</select>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment