Laravel image upload to database - php

Question

This function is the function I use to store a new company:
public function store(Request $request)
{
$file = $request->file('logo');
$filename = 'company-logo-' . time() . '.' . $file->getClientOriginalExtension();
$path = $file->storeAs('public', $filename);
dd($path);
Company::create([
'name' => $request->name,
'email' => $request->email,
'logo' => $request->logo,
'website' => $request->website
]);
return redirect('/company/all');
}
This view is the one with the form:
#extends('layouts.app')
#section('content')
<div class="card">
<div class="card-body">
<h4 class="card-title">Create a Company</h4>
</div>
<div class="container">
<div class="jumbotron">
<ul class="list-group">
<li class="list-group-item">
<h3>Enter Company Information:</h3>
<form action="{{ route('company.store') }}" enctype="mutlipart/form-data" method="POST">
#csrf
<div class="form-group">
<input type="text" class="form-control" name="name" placeholder="Company name" value="{{ old('name') }}">
</div>
<div class="form-group">
<input type="text" class="form-control" name="email" placeholder="Email" value="{{ old('email') }}">
</div>
<div class="form-group">
<input class="form-control" type="file" name="logo">
</div>
<div class="form-group">
<input class="form-control" type="url" name="website" placeholder="Website" value="{{ old('website') }}">
</div>
<button class="btn btn-primary" type="submit">Add Company</button>
</form>
</li>
</ul>
</div>
</div>
</div>
#endsection
This is the route:
Route::post('/add', 'CompaniesController#store')->name('store');
Well, what happens when I try to submit this form is that $file variable always returned with null:
Error
Call to a member function getClientOriginalExtension() on null
http://localhost:8000/company/add
Basically what I want to do is send the name of the image to the database and upload the image to my public folder. Neither happens with this code. when I erase the part starting from $file till dd($path); it adds the values to the database but the image hasn't been uploaded.
Any help? Thanks in advance.

Answer 1

First of all the attribute on the form is wrong which is enctype="mutlipart/form-data" and it should be enctype="multipart/form-data"
or an alternative you can use below code according to your requirements:
if($request->hasFile('logo')){
$file = $request->file('logo');
$fileName = 'company-logo-' .time().$file->getClientOriginalName();
Storage::put('public/'.$fileName,file_get_contents($file));
now you can store the $filename variable in database and image will be uploaded to storage/app/public folder
}
please add use Storage on top of file and run php artisan storage:link to make symbolic link between storage folder and public folder

Answer 2

First you change enctype="multipart/form-data" instead of enctype="mutlipart/form-data" in your form.
Then put this code to your controller
public function store(Request $request)
{
if($request->hasFile('logo')) {
$img_ext = $request->file('logo')->getClientOriginalExtension();
$filename = 'company-logo-' . time() . '.' . $img_ext;
$path = $request->file('logo')->move(public_path(), $filename);//image save public folder
}
//You should store only filename not path in db
Company::create([
'name' => $request->name,
'email' => $request->email,
'logo' => $filename,
'website' => $request->website
]);
return redirect('/company/all');
}

Answer 3

try changing to:
public function store(Request $request)
{
$file = $request->file('logo');
$path = '';
if($file) {
$filename = 'company-logo-' . time() . '.' . $file->getClientOriginalExtension();
$path = $file->storeAs('public', $filename);
}
Company::create([
'name' => $request->name,
'email' => $request->email,
'logo' => $path,
'website' => $request->website
]);
return redirect('/company/all');
}

Answer 4

if (Input::hasFile('logo')) {
$file = Input::file('logo');
$ext = $file->getClientOriginalExtension();
$file_name = 'company-logo-' . time() . ".{$ext}";
$path = base_path().'/public/';
$file->move($path , $file_name);
}

Answer 5

You can use the file pond. The core library is written in vanilla JavaScript and therefore can be used everywhere. Visit: https://pqina.nl/filepond/