Laravel - Upload File to Database

php jquery laravel-5 laravel-5.2 bootstrapping

13,646

You need to give the file input field a name like

<form enctype="multipart/form-data">
        <div class="form-group">
            <input id="file-5" name="image" class="file" type="file" multiple data-preview-file-type="any" data-upload-url="#">
        </div>
</form>

Then in your controller method you can access the uploaded file and get the various properties

**EDIT**
$destinationPath = storage_path().'/uploads/';
or
$destinationPath = public_path().'/uploads/';

//storage_path will give the fully qualified path to the storage folder
//public_path will give the fully qualified path to the public folder
//uploads - is the folder name where you want to store the user uploaded files, could be any name you prefer.
**EDIT end**

// Retrieving An Uploaded File
$file = Input::file('image');

// Determining If A File Was Uploaded
if (Input::hasFile('image'))
{
    //
}

// Determining If An Uploaded File Is Valid
if (Input::file('image')->isValid())
{
    //
}

// Moving An Uploaded File
Input::file('image')->move($destinationPath);
Input::file('image')->move($destinationPath, $fileName); //$filename is the name by which you want to store the file - change the name if required by by app.

// Getting Requested file path
$path = Input::file('image')->getRealPath();

// Getting Original name of the file
//**Edit** - gives the original filename as on uploading user's system. **Edit end**
$name = Input::file('image')->getClientOriginalName();

// Getting uploaded File extention
$extension = Input::file('image')->getClientOriginalExtension();

// Getting Size of the file
$size = Input::file('image')->getSize();

// Getting MIME Type of uploaded file
$mime = Input::file('image')->getMimeType();

You can then store the properties in your database either through a Model corresponding to the database table in your case lamanInformasi or using query builder directly to the database table with raw queries.

Have a look at laravel documentation:
Database - query builder
Eloquent - model approach

You can use Laravel's filesystem to retrieve the files from a folder and prepare a list view for users to see the files available for download.

Then use can leverage Laravel's Response Download to provide the download functionality for the users.

Hope this helps.

13,646

Author by

Grace Michelle

Updated on July 15, 2022

Comments

Grace Michelle almost 2 years

These are what I have :

Database table named lamanInformasi, which has field named isi.

This is what I want :

User can upload multiple document or image files, and the files will be stored to database. The file names will be saved to isi field, and the files itself will be saved to a folder named propic. User also can show the file they want on the website and download it.

This is what I have done :

I used bootstrap plugin to input file. I used this source. I just used files inside the js and css folder. This is my code:

<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
    <link href="../css/fileinput.css" media="all" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="../js/fileinput.js" type="text/javascript"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js" type="text/javascript"></script>
</head>
<body>
    <div class="container kv-main">
        <div class="page-header">
        <h1>Upload Files</h1>
        </div>

        <form enctype="multipart/form-data">
            <div class="form-group">
                <input id="file-5" class="file" type="file" multiple data-preview-file-type="any" data-upload-url="#">
            </div>
        </form>
    </div>
</body>
<script>
        $("#file-5").fileinput({
            uploadUrl: "{{ url('lamanInformasi') }}",
            uploadAsync: false,
            previewFileIcon: '<i class="fa fa-file"></i>',
            allowedPreviewTypes: 'image',
            previewFileIconSettings: {
                'doc': '<i class="fa fa-file-word-o text-primary"></i>',
                'xls': '<i class="fa fa-file-excel-o text-success"></i>',
                'ppt': '<i class="fa fa-file-powerpoint-o text-danger"></i>',
                'jpg': '<i class="fa fa-file-photo-o text-warning"></i>',
                'pdf': '<i class="fa fa-file-pdf-o text-danger"></i>',
                'zip': '<i class="fa fa-file-archive-o text-muted"></i>',
                'htm': '<i class="fa fa-file-code-o text-info"></i>',
                'txt': '<i class="fa fa-file-text-o text-info"></i>',
                'mov': '<i class="fa fa-file-movie-o text-warning"></i>',
                'mp3': '<i class="fa fa-file-audio-o text-warning"></i>',
            },
            previewFileExtSettings: {
                'doc': function(ext) {
                    return ext.match(/(doc|docx)$/i);
                },
                'xls': function(ext) {
                    return ext.match(/(xls|xlsx)$/i);
                },
                'ppt': function(ext) {
                    return ext.match(/(ppt|pptx)$/i);
                },
                'zip': function(ext) {
                    return ext.match(/(zip|rar|tar|gzip|gz|7z)$/i);
                },
                'htm': function(ext) {
                    return ext.match(/(php|js|css|htm|html)$/i);
                },
                'txt': function(ext) {
                    return ext.match(/(txt|ini|md)$/i);
                },
                'mov': function(ext) {
                    return ext.match(/(avi|mpg|mkv|mov|mp4|3gp|webm|wmv)$/i);
                },
                'mp3': function(ext) {
                    return ext.match(/(mp3|wav)$/i);
                },
            }
        });
</script>

This is my question

How to save the files to database? How to show the files on the website? How to make the files become downloadable? Thanks