Bootstrap Image Uploader

Question

I have bootstrap image upload plugin. But in my services edit page, I can not show auto thumbnails of before uploaded images. When click upload button and select image, I only see thumbnail but I can not see thumbnail after uploaded. How can I show thumbnail in this image upload code?

Upload Code:

<div class="form-group row">
    <label class="col-lg-2 col-form-label font-weight-semibold">Block button:</label>
    <div class="col-lg-10">
        <input type="file" name="service_1" class="file-input" data-browse-class="btn btn-primary btn-block" data-show-remove="true" data-show-caption="true" data-show-upload="false" data-fouc>
        <span class="form-text text-muted">Display the widget as a single block button.</span>
    </div>

Answer 1

Before uploading, your upload plugin create thumbnails preview of selected files. This are not uploaded to the server, only the orifinal files are uploaded. You need to make this job server side via php script, save thumbnails and then serve to the clients.

Please take a look on this

1. Latest jQuery File Upload easy integration with codeigniter
2. jQuery-File-Upload

This plugin support many options, like image resizing, max size, file validation ...