<x-dynamic-component
:component="$getFieldWrapperView()"
:field="$field"
>
<div x-data="{ state: $wire.$entangle('{{ $getStatePath() }}') }">
<!-- Interact with the `state` property in Alpine.js -->
<input type="file" id="directoryInput" wire:model="{{ $getStatePath() }}.folder[]" webkitdirectory multiple>
<div wire:loading wire:target="{{ $getStatePath() }}.folder[]">Uploading...</div>
</div>
<script>
console.log("hello");
document.addEventListener('livewire:load', function () {
console.log("hello");
})
document.getElementById("directoryInput").addEventListener(
"change",
(event) => {
var names = [];
for (const file of event.target.files) {
names.push(file.webkitRelativePath);
}
console.log(names);
},
false,
);
</script>
</x-dynamic-component>
<x-dynamic-component
:component="$getFieldWrapperView()"
:field="$field"
>
<div x-data="{ state: $wire.$entangle('{{ $getStatePath() }}') }">
<!-- Interact with the `state` property in Alpine.js -->
<input type="file" id="directoryInput" wire:model="{{ $getStatePath() }}.folder[]" webkitdirectory multiple>
<div wire:loading wire:target="{{ $getStatePath() }}.folder[]">Uploading...</div>
</div>
<script>
console.log("hello");
document.addEventListener('livewire:load', function () {
console.log("hello");
})
document.getElementById("directoryInput").addEventListener(
"change",
(event) => {
var names = [];
for (const file of event.target.files) {
names.push(file.webkitRelativePath);
}
console.log(names);
},
false,
);
</script>
</x-dynamic-component>
