Forms Uploading Files

Modifying our create view for file input

{!! Form::open(['method'=>'POST','route'=>'posts.store','files'=>true]) !!}
    <div class="form-group">
        {!! Form::label('title','Title:') !!}
        {!! Form::text('title',null,['class'=>'form-control']) !!}
    </div>
    <div class="form-group">
        {!! Form::file('file',['class'=>'form-control']) !!}
    </div>
    <div class="form-group">
        {!! Form::submit('Create Post',['class'=>'btn btn-primary']) !!}
    </div>
{!! Form::close() !!}

You are adding a files = true to the form tag and then adding a file field.

Retrieving File Data

Update store function to just return the file name and comment out validation from CreatePostRequest

    public function store(CreatePostRequest $request)
    {
        $file = $request->file('file');
        echo $file;
        echo '<br>';
        echo $file->getClientOriginalName();

        echo '<br>';
        echo $file->getClientSize();
    }

The first shows the temporary file name and the second shows the file name from your computer.

Persisting File Data into the Database

Create a migration to store the file info to database:

php artisan make:migration add_path_column_to_posts --table=posts

Open up and add these to up and down functions:

$table->string('path');
$table->dropColumn('path');

Then migrate:

php artisan migrate

Update your Post model to allow path column for mass migration:

    protected $fillable = [
        'title',
        'content',
        'user_id',
        'path'
    ];

Now edit your store function in PostsController:

    public function store(CreatePostRequest $request)
    {
        $input = $request->all();
        if($file = $request->file('file')){
            $name = $file->getClientOriginalName();
            $file->move('images',$name);
            $input['path'] = $name;
        }
        Post::create($input);
    }

Also if you check your public folder, you’ll see an images folder has been created with the images name.

Displaying images and using accessors to make it easy

Update your views post index page:

<ul>
    @foreach($posts as $post)
        <div class="image-container">
            <img height="100" src="/images/{{$post->path}}" alt="" />
        </div>
        <li><a href="{{route('posts.show',$post->id)}}">{{$post->title}}</a></li>
    @endforeach
</ul>

Let’s create a simple accessor that puts the directory of the images in the Post model. In Post model:

    public $directory = "/images/";public $directory = "/images/";
    public function getPathAttribute($value){
        return $this->directory.$value;
    }

Now change index.blade.php to:

<ul>
    @foreach($posts as $post)
        <div class="image-container">
            <img height="100" src="{{$post->path}}" alt="" />
        </div>
        <li><a href="{{route('posts.show',$post->id)}}">{{$post->title}}</a></li>
    @endforeach
</ul>