<input id="files" class="file" type="file" name="images" data-preview-file-type="any">
<?php
$key=1;
$dir    = '../../output/reps';
$dir2    = 'output/reps';
$files1 = scandir($dir);
foreach($files1 as $file){
if (strpos($file, $_REQUEST['payment_type']) !== false) {
$filename=str_replace('000_'.$_REQUEST['payment_type'].'_','',$file);
$ipv.="'".$dir2."/".$file."',";
$ipvc.='{type: "pdf", size: '.filesize($dir.$item).', filename: "'.$file.'", caption: "'.$filename.'", key: '.$key++.',extra: {file: "'.$dir2.'/'.$file.'"}},';

}}

?>

<script>
function gendir() {
    $("#files").fileinput({
        theme: 'fa',
        uploadUrl: 'resources/save_resource.php', // you must set a valid URL here else you will get an error
        deleteUrl: 'resources/delete_resource.php',
        allowedFileExtensions: ['jpg', 'png', 'gif', 'pdf', 'html', 'doc', 'xlsx'],
        overwriteInitial: false,
        hideThumbnailContent: true,
        dropZoneEnabled: false,
        uploadAsync: false,
        maxFileSize: 40000,
        maxFilesNum: 0,
        fileActionSettings: {
            showRemove: false,
            showBrowse: false,
            showUpload: false,
            showZoom: true,
            showDrag: false
        },

        initialPreviewAsData: true,
        initialPreviewDownloadUrl: 'output/reps/{filename}',
        initialPreview: [
            <?php echo $ipv?>
        ],
        initialPreviewConfig: [
            <?php echo $ipvc?>
        ],
        append: true
    });
}

//gendir()
$(".file-caption-main,.fileinput-remove").css({
    'display': 'none'
});
$(".kv-preview-thumb").css({
    'background-color': '#ffffff'
});
</script>