Hi, I have been investigating for several days how I can improve the image loading functionality without results.
Problem:
- By creating the multiple image upload button, the user can select as many images as they want. To limit that procedure to only being able to upload 30 images I use max: 30 and it seems to work fine.
If the user clicks the button again, it replaces the loaded images with the new ones selected.
Therefore I try to create a functionality that allows adding more images:
My input:
<input wire:model="imagenes" type="file" name="imagenes" accept="image/*" class="form-control-file" multiple>
Add more images functionality:
<button class="text-white btn btn-info btn-sm" wire:click.prevent="add({{$i}})">
Agregar más fotos
</button>
@foreach($inputs as $key => $value)
<input wire:model="name.{{ $value }}" type="file" name="imagenes" accept="image/*" class="form-control-file">
@endforeach
What I need is to be able to validate that no more than 30 images are uploaded between the two inputs in the view.
Validate:
$this->validate([
'imagenes' => 'max:30',
]);
They could give me a little more light to finish this functionality. Thanks a lot