This website uses cookies

Our website, platform and/or any sub domains use cookies to understand how you use our services, and to improve both your experience and our marketing relevance.

CloudwaysCDN — a powerful solution that offers superior performance and satisfied global audience for your business. Read More

How to Upload Multiple Images and Files in Laravel with Validation

Updated on  7th February

6 Min Read
laravel file upload
Reading Time: 6 minutes

File upload is an essential aspect of any project. Given this importance, it is surprising that many developers face challenges of adding file upload feature to their projects. In particular, developers are unsure about how to upload and validate files.

In this tutorial, I will discuss how to implement Laravel file upload functionality with multiple file and image uploading option. I will use the Laravel storage folder and then create database record for uploading files. I will use Laravel 5.5 and Bootstrap to power the code of this tutorial.

You might also like: PHP File Upload with jQuery AJAX

Prerequisites

For the purpose of this tutorial, I assume that you have a Laravel application installed on a web server. My setup is:

  • Linux/Unix or WAMP/XAMPP environment
  • Laravel 5.5
  • PHP 7.1
  • MySQL
  • Web server (Apache, NGINX or integrated PHP web server for testing)

I have installed a Laravel app on a Cloudways managed Laravel server because it has everything I’ll need for this tutorial. If you do not have an account on Cloudways, sign up for free, and check out the following GIF to setup the server and application in just a few clicks.

Create Model with Migration

I will start by creating the model and the tables in which I will save the files.

Launch the SSH terminal, go to the application’s public root folder and type following commands:

Item Model

When the migration and the model have been created successfully, go to app/Item.php and add the following Model code to it:

Create the Migration

Go to the database/migration folder and open the migration file for item. You will see the default structure that include (in my case) id , name, timestamps.

Model Of ItemDetails

The model comprises of the following code:

In the above code, I used belongTO because itemDetails belongs to Item table and item_id is the foreign key. This is known as inverse relation in Laravel.

Migration of ItemDetails Table

Go to the database/migration folder and open the migration file for itemdetails. You will see the default structure that include id , name . timestamps.

 

Next , In the app/Providers/AppServiceProvider.php file, the boot method set a default string length:

Database Configuration

In a Laravel powered app, database configuration is handled by two files: env and config/database.php. In my case, I created a database with the name uploading. The Cloudways Database Manager makes the entire process very easy.

Next, run the following command in the terminal to create tables in the database:

php artisan migrate

Now, when you check the database, you will see that the tables have been created  successfully.

You might also like: Connect Laravel with Firebase Real Time Database

Set up the Route

Route sets the application URL and the controller method for this URL. Routes are located in route/web.php and contains the following code:

Create the Controller

Next, create the Controller by using the following command:

php artisan make:controller UploadController

Next, go to app/Http/Controller/UploadController and open the Controller file. Add the following code to it:

View File (Upload_form.blade.php)

In the view file, I have used Bootstrap for styling the code, link stylesheet , jQuery, JavaScript files.

Controller with Validation

I have use Bootstrap classes for showing the alert for validation and use Laravel Validation methods to validate the type of file. Use the following code for the controller:

Storing Data and Files in Laravel

Laravel provides a storage filesystem that stores all the data including files and images.

For this, Laravel provides config/filesystems.php, located in the config folder. In this file, you can specify the locations for your file storage.

 

Using the above code snippet, you could save the files in app/storage folder instead of the public folder. This is a good coding practice for storing data because this location is inaccessible from the browser. For the purpose of this tutorial, I have created a folder with the name photos in storage/app/.

When the run the app in the browser, you will see the following screens:

With Validation

laravel file upload validation

laravel multiple file upload form

laravel file upload error

To see the image and file upload in Laravel in action, check out the demo.

Share your opinion in the comment section. COMMENT NOW

Pardeep Kumar

Pardeep is a PHP Community Manager at Cloudways - A Managed PHP Hosting Platform. He love to work on Open source platform , Frameworks and working on new ideas. You can email him at pardeep.kumar@cloudways.com

Create Laravel apps without the worry of server management.

Deploy your app on optimized PHP hosting servers for Laravel.

Get Our Newsletter
Be the first to get the latest updates and tutorials.

THERE’S MORE TO READ.