This is a small piece of my code where I am trying to upload all sorts of documents (word+images). But it seems only images are getting uploaded well. Rest word files, excel files etc are not getting displayed. What changes are required to make them properly visible?(Please have a look at my screenshot)Note: In the screenshot, the third file is not visible
Code:
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="<?php echo base_url("css/bootstrap.css"); ?>">
</head>
<body>
<div class="container">
<p><?php echo $this->session->flashdata('statusMsg'); ?></p>
<form enctype="multipart/form-data" action="" method="post">
<div class="form-group">
<label>Choose Files</label>
<input type="file" class="form-control" name="userFiles[]" multiple/>
<button type="submit" class="btn-success form-control" name="fileSubmit" value="UPLOAD" width="100px">UPLOAD</button>
</div>
</form>
<div class="row">
<div class="thumbnail">
<?php $thumbnails = array_chunk( $files, 3 );
?>
<?php if(!empty($files)) {
foreach($thumbnails as $files) { ?>
<div class="row">
<?php foreach($files as $file) { ?>
<div class="col-md-4">
<div class="thumbnail">
<img src="<?php echo base_url('uploads/files/'.$file['file_name']); ?>" alt="" >
<p>Uploaded On <?php echo date("j M Y",strtotime($file['created'])); ?></p>
</div>
</div>
<?php } ?>
</div>
<?php } ?>
<?php } else { ?>
<p>Image(s) not found.....</p>
<?php } ?>
</div>
</div></div></div>
</body>
</html>