Manipulate the file plugin using various built in methods.

<div class="file-loading">
    <input id="file-4" name="file-4[]" type="file" multiple>
</div>
<hr>
<button class="btn btn-secondary btn-disable" type="button">Disable</button>
<button class="btn btn-danger btn-destroy" type="button">Destroy</button>
<button class="btn btn-success btn-recreate" type="button">Recreate</button>
<button class="btn btn-info btn-refresh" type="button">Refresh</button>
<button class="btn btn-outline-secondary btn-clear" type="button">Clear</button>
<script>
$(document).ready(function() {
    // the file input
    var $el4 = $('#file-4'), initPlugin = function() {
        $el4.fileinput({previewClass:''});
    };

    // initialize plugin
    initPlugin();
   
    // `disable` and `enable` methods
    $(".btn-disable").on('click', function() {
        var $btn = $(this);
        if (!$el4.data('fileinput')) {
           initPlugin();
        }
        if ($el4.attr('disabled')) {
            $el4.fileinput('enable');
            $btn.html('Disable').removeClass('btn-primary').addClass('btn-secondary');
        } else {
            $el4.fileinput('disable');
            $btn.html('Enable').removeClass('btn-secondary').addClass('btn-primary');
        }
    });

    // `destroy` method
    $(".btn-destroy").on('click', function() {
        if ($el4.data('fileinput')) {
            $el4.fileinput('destroy');
        }
    });

    // recreate plugin after destroy
    $(".btn-recreate").on('click', function() {
        if ($el4.data('fileinput')) {
            return;
        }
        initPlugin();
    });

    // refresh plugin with new options 
    $(".btn-refresh").on('click', function() {
        if (!$el4.data('fileinput')) {
            // just normal init when plugin is not initialized
            $el4.fileinput({previewClass:'bg-info'}); 
        } else {
            // refresh already initialized plugin with new options
            $el4.fileinput('refresh', {previewClass:'bg-info'});
        }
    });
    
    // clear/reset the file input
    $(".btn-clear").on('click', function() {
        $el4.fileinput('clear');
    });
});
</script>

Delete validation of inital preview file thumbnails. This example demonstrates how one can show a confirmation dialog before deleting using the filebeforedelete event. It also mentions an example of how you can use methods like getFilesCount to return the total files selected.

<div class="file-loading">
    <input id="file-5" name="file-5[]" type="file" multiple>
</div>
<script>
$(document).ready(function() {
    var krajeeGetCount = function(id) {
        var cnt = $('#' + id).fileinput('getFilesCount');
        return cnt === 0 ? 'You have no files remaining.' :
            'You have ' +  cnt + ' file' + (cnt > 1 ? 's' : '') + ' remaining.';
    };
    $('#file-5').fileinput({
        overwriteInitial: false,
        validateInitialCount: true,
        initialPreview: [
            "<img class='kv-preview-data file-preview-image' src='https://picsum.photos/id/260/1920/1080'>",
            "<img class='kv-preview-data file-preview-image' src='https://picsum.photos/id/261/1920/1080'>",
        ],
        initialPreviewConfig: [
            {caption: "Nature-1.jpg", width: "120px", url: "/site/file-delete", key: 1},
            {caption: "Nature-2.jpg", width: "120px", url: "/site/file-delete", key: 2}
        ],
    }).on('filebeforedelete', function() {
        var aborted = !window.confirm('Are you sure you want to delete this file?');
        if (aborted) {
            window.alert('File deletion was aborted! ' + krajeeGetCount('file-5'));
        };
        return aborted;
    }).on('filedeleted', function() {
        setTimeout(function() {
            window.alert('File deletion was successful! ' + krajeeGetCount('file-5'));
        }, 900);
    });
});
</script>

A more advanced variation of delete validation 1 scenario where a third party JS plugin like jquery-confirm is used to render the confirmation prompt. In this case the filebeforedelete event must return a promise object as shown.

<!-- load the third party plugin assets (jquery-confirm) -->
<link href="//cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.css" rel="stylesheet" type="text/css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>

<div class="file-loading">
    <input id="file-6" name="file-6[]" type="file" multiple>
</div>
<script>
$(document).ready(function() {
    var krajeeGetCount = function(id) {
        var cnt = $('#' + id).fileinput('getFilesCount');
        return cnt === 0 ? 'You have no files remaining.' :
            'You have ' +  cnt + ' file' + (cnt > 1 ? 's' : '') + ' remaining.';
    };
    $('#file-6').fileinput({
        overwriteInitial: false,
        validateInitialCount: true,
        initialPreview: [
            "<img class='kv-preview-data file-preview-image' src='https://picsum.photos/id/1038/1920/1080'>",
            "<img class='kv-preview-data file-preview-image' src='https://picsum.photos/id/1039/1920/1080'>",
        ],
        initialPreviewConfig: [
            {caption: "Nature-1.jpg", width: "120px", url: "/site/file-delete", key: 1},
            {caption: "Cats-2.jpg", width: "120px", url: "/site/file-delete", key: 2}
        ],
    }).on('filebeforedelete', function() {
        return new Promise(function(resolve, reject) {
            $.confirm({
                title: 'Confirmation!',
                content: 'Are you sure you want to delete this file?',
                type: 'red',
                buttons: {   
                    ok: {
                        btnClass: 'btn-primary text-white',
                        keys: ['enter'],
                        action: function(){
                            resolve();
                        }
                    },
                    cancel: function(){
                        $.alert('File deletion was aborted! ' + krajeeGetCount('file-6'));
                    }
                }
            });
        });
    }).on('filedeleted', function() {
        setTimeout(function() {
            $.alert('File deletion was successful! ' + krajeeGetCount('file-6'));
        }, 900);
    });
});
</script>