Skip to content

Instantly share code, notes, and snippets.

@hallindavid
Created April 6, 2021 12:36
Show Gist options
  • Save hallindavid/f4b6de6b79cbaaf500a8df778f7fc009 to your computer and use it in GitHub Desktop.
Save hallindavid/f4b6de6b79cbaaf500a8df778f7fc009 to your computer and use it in GitHub Desktop.
Laravel Livewire/AlpineJS PikaDay component (with weird date format MM/DD/YYYY)
<div
x-data="{ value: @entangle($attributes->wire('model')), picker: undefined }"
x-init="new Pikaday({ field: $refs.input, format: 'MM/DD/YYYY', onOpen() { this.setDate($refs.input.value) } })"
x-on:change="value = $event.target.value"
>
<input
{{ $attributes->whereDoesntStartWith('wire:model')->merge(['class' => 'border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm']) }}
x-ref="input"
type="text"
x-bind:value="value"
/>
</div>
@hallindavid
Copy link
Author

If you're binding to a model, make sure you cast the date into the same format

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