When I try to handle file uploads in Livewire the request(‘upload’) value is always null when I submit my form.
<form wire:submit.prevent="uploadDocument()">
<label for="name" class="block text-sm leading-5 font-medium text-gray-700">
Document Name
</label>
<input wire:model.lazy="name" class="flex-1 form-input block w-full min-w-0 rounded-none rounded-md transition duration-150 ease-in-out sm:text-sm sm:leading-5" type="text" id="name" name="name" required="required"/>
@error('name')<br><span class="text-red-500 text-xs italic">{{$message}}</span> @enderror
<label for="upload" class="mt-8 block text-sm leading-5 font-medium text-gray-700">
Upload a Document
</label>
<input type="file" wire:model="upload" id="upload" class="mt-2 mb-2 form-control"/>
@error('upload')<br><span class="text-red-500 text-xs italic">{{$message}}</span> @enderror
<div class="flex justify-end">
<button type="submit" class="inline-flex items-center justify-center px-2 py-1 border border-green-700 font-medium rounded-md text-green-700 bg-green-100 hover:bg-green-50 focus:outline-none focus:border-green-300 focus:shadow-outline-green active:bg-green-200 transition ease-in-out duration-150 text-xs sm:leading-5">
Upload Document
</button>
</div>
</form>
Because the request(‘upload’) is always empty the validation in my controller always fails.
public function uploadDocument()
{
$this->validate([
'name' => 'required',
'upload' => 'file|max:5120'
]);
$filename = Storage::putFile('documents', $this->upload);
$document = new Document;
$document->name = $this->name;
$document->diary_id = $this->diary->id;
$document->uploaded_by = Auth::user()->id;
$document->filename = $this->upload->getClientOriginalName();
$document->doc_url = $filename;
$document->save();
$this->diary->documents()->attach($document);
$this->diary->refresh();
}
I followed Caleb’s screencast course for file uploads but cant seem to get it to work.
I have added Use WithFileUploads;
My Livewire version is v1.3.2.
Can you see what I’m doing wrong?
