Как установить атрибут в livewire datepicker?

В приложении livewire 1.3, глядя на пример DatePicker на https://laravel-livewire.com/docs/alpine-js, я не вижу, как установить настраиваемый параметр и использовать его при выборе даты? Мне нужно ввести дату в формате скрытого ввода для сохранения в db. Добавляю в атрибуты 1 параметр:

<x-date-picker
    wire:model="start_date"
    id="start_date"
    autocomplete="off"
    attributes="{hidden_element:'hidden_start_date'}"
/>

и в resources/views/components/date-picker.blade.php: и попробуйте прочитать событие выбора даты:

<div>
    <input
        x-data
        x-ref="input"
        x-init="new Pikaday({
            field: $refs.input,
            format:'M/D/YYYY',
            onSelect: function() {
                console.log(this.el); // that shows html code of datepicker
                console.log('getAttribute:');
                console.log(this.el.getAttribute('hidden_element')); // shown null
                
                $( this.el.getAttribute('hidden_element') ).val( dateToMySqlFormat(this._d) );
                // code above does not work !
            }
        })"
        type="text"
        {{ $attributes }}
    >
</div>

Какой правильный способ?

Благодарность!

1 ответ

Решение

Я нашел решение с:

<x-date-picker
    wire:model="start_date"
    id="start_date"
    autocomplete="off"
    hidden_element="hidden_start_date"
/>

                                            

и в моем компоненте:

<div>
    <input
        x-data
        x-ref="input"
        x-init="new Pikaday({
            field: $refs.input,
            format:'M/D/YYYY',
            onSelect: function() {
{{--                console.log(this);--}}
                $('#'+$el.getAttribute('hidden_element')).val( dateToMySqlFormat(this._d) );
            }
        })"
        type="text"
        {{ $attributes }}
    >
</div>

!

Другие вопросы по тегам