Level 122
you should close your input tag, but I doubt thats the issue
1 like
Mar 30, 2024
7
Level 2
File uploads inside Livewire component not working
I have a form inside a livewire component:
<form enctype="multipart/form-data" method="POST" action="{{ route('posts.store') }}" >
@csrf
<div class="shadow appearance-none mt-8 px-5 py-5 sm:p-6 sm:pb-4 bg-white border rounded border-gray-300">
<div class="mb-4">
<label for="description"
class="block text-gray-700 text-sm font-bold mb-2">Summary</label>
<textarea cols="30" rows="10" type="text" value="{{ old('description') }}"
class="@error('description') is-invalid @enderror bg-none border rounded border-gray-300 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
id="description" name="description"></textarea>
</div>
<div class="mb-4">
<label for="file"
class="block text-gray-700 text-sm font-bold mb-2">Select File</label>
<input type="file" class="@error('fls') is-invalid @enderror bg-none border rounded border-gray-300 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
id="fls" name="fls">
</div>
<button type="submit"> Post </button>
</div>
</form>
When I click on the Post button, the form validator :
return [
'description' => 'required',
'fls' => 'file|required|mimetypes:jpeg,jpg,pdf,png',
];
fails, redirecting back to the same page. When I try to Log::info($request->all()) just before the above validation rules, I see the file is missing:
[2024-02-30 05:11:39] local.INFO: array (
'_token' => 'MdEnIEhjcoYVSNRsdJx1Z93I6CXRMjmupR9YFQPd',
'description' => 'Description Text!',
)
What am I missing ? I prefer uploading the file via the controller compared to using Livewire since the code has been working until now.
Level 2
@Snapey The browser does not show any error on the console.
Level 122
@FireBlade i wouldnt expect it to
Level 122
what does the livewire component do?
1 like
Level 2
@Snapey The Livewire component has nothing alse except the form. Its included as so:
<x-app-layout>
<livewire:new-post />
</x-app-layout>
<?php
namespace App\Http\Livewire;
use Livewire\Component;
use Illuminate\Support\Facades\Log;
class NewPost extends Component
{
}
public function render()
{
return view('livewire.new-post');
}
}
Level 122
@try loading the view without Livewire
Level 2
Trying to validate using the file rule https://laravel.com/docs/9.x/validation#validating-files by including the required class:
use Illuminate\Validation\Rules\File;
validating like so:
'fls' => 'required',
File::types(['jpeg', 'jpg','png','pdf'])
->max(12 * 1024)
generates an error:
Class "Illuminate\Validation\Rules\File" not found
This makes me believe that the validation rule
'fls' => 'file|required|mimetypes:jpeg,jpg,pdf,png',
is the problem in the initial issue. After testing with a basic form that has this validation rule,
'required|array|min:1|max:1'
the form is posting !!! So am wondering why the validation rule :
'fls' => 'file|required|mimetypes:jpeg,jpg,pdf,png',
is not working ????
Please or to participate in this conversation.