Uploading multiple files is a very common requirement in Laravel 11; Simply create routes and controllers to handle requests and validation for multiple file uploading, and create forms in Blade View to allow users to select multiple files at once for upload.
How to Upload Multiple Files in laravel 11?
Steps to create multiple file upload with validation in laravel 11 applications:
Step 1 – Set up New Laravel Application
Start your cmd or terminal window and run the composer create-project --prefer-dist laravel/laravel myBlog command to install and setup a new laravel 11 application in your system:
composer create-project --prefer-dist laravel/laravel myBlog
Step 2 – Define File Upload Routes
Define file upload routes in the web.php file, which are used to show multiple file upload forms and send form data to the controller file; like the following:
use App\Http\Controllers\MultipleUploadController;
Route::get('files-upload', [MultipleUploadController::class, 'index']);
Route::post('multipleUploads', [MultipleUploadController::class, 'store']);
Step 3 – Create Multiple Upload Controller
Run the php artisan make:controller MultipleUploadController command on cmd to create a file upload controller file, which handles multiple file upload logic into it:
php artisan make:controller MultipleUploadController
Now create two methods in MultipleUploadController.php file, which handle multiple file upload requests in these methods; Like the following:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class MultipleUploadController extends Controller
{
public function index()
{
return view('files-upload');
}
public function store(Request $request)
{
$request->validate([
'files' => 'required',
'files.*' => 'required|mimes:pdf,xlx,csv|max:2048',
]);
if($request->hasfile('files'))
{
foreach($request->file('files') as $key => $file)
{
$path = $file->store('public/files');
$name = $file->getClientOriginalName();
$insert[$key]['name'] = $name;
$insert[$key]['path'] = $path;
}
}
// write code to insert multiple files in database
return redirect('files-upload')->with('status', 'Files has been uploaded Successfully in Laravel Folder');
}
}
Step 4 – Create Form For Multiple File Upload
Navigate to resources/views folder and create a file named files-upload.blade.php.
Now create a files upload form with input and multipart in Blade Views (files-upload.blade.php) which will help users to choose multiple files for uploading; like the following:
<!DOCTYPE html>
<html>
<head>
<title>Multiple File Upload with Validation in Laravel 11 - Tutsmake.com</title>
<meta name="csrf-token" content="{{ csrf_token() }}">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
</head>
<body>
<div class="container mt-5">
<h2 class="text-center">Multiple File Upload with Validation in Laravel 11 - Tutsmake.com</h2>
<div class="mt-2">
<form name="multipleUploads" method="POST" action="{{ url('multipleUploads') }}" accept-charset="utf-8" enctype="multipart/form-data">
@csrf
<div class="col-md-6 offset-md-3 mt-2">
<div class="form-group">
<input type="file" name="files[]" placeholder="Choose files" class="form-control form-control-lg" multiple >
</div>
@error('files')
<div class="alert alert-danger mt-1 mb-1">{{ $message }}</div>
@enderror
</div>
<div class="col-md-6 offset-md-3 mt-2">
<button type="submit" class="btn btn-primary" id="submit">Submit</button>
</div>
<div class="col-md-6 offset-md-3 mt-2">
@if(session('status'))
<div class="alert alert-success">
{{ session('status') }}
</div>
@endif
</div>
</form>
</div>
</div>
</body>
</html>
Step 5 – Run And Test Application
Run php artisan serve command to start the application server for testing:
php artisan serve
Open your browser and type the following url on it:
http://127.0.0.1:8000/files-upload
Conclusion
In this guide, we have shown you how you can upload multiple files at once in Laravel 11 and save to a public storage folder with verification.
If you have any queries regarding multiple file uploading, then you can mail us at [email protected].
