Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
    <title>Get File Details</title>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
 </head>
<body style="font:13px Verdana;">
    <p><input type="file" id="fileUpload" multiple /></p>
      
    <table id="tblUpload" border="1">
        <tr>
        </tr>
    </table>
    
    <input type="submit" value="Show Details" onclick="FileDetails()" 
            style="font:150% Georgia;font-style:italic;" />
    </p>
</body>
 
$(function() {
  FileDetails = function() {
        var input = document.getElementById('fileUpload');
        var output = document.getElementById('tblUpload');
        output.innerHTML = '<tr>';
        output.innerHTML += '<th class="thStyle" style="width: 400px;"><b>File Name</b></th><th class="thStyle" style="width: 255px;"><b>Preview Image</b></th>';
        for (var i = 0; i < input.files.length; ++i) {
            output.innerHTML += '<td style="padding: 10px; width: 300px;">' + input.files.item(i).name + '</td>' +
                '<td style="padding: 10px; width: 150px; color: #0d47a1"><a href="#">Show</a>&emsp; &emsp; &emsp;<a href="#">Delete</a></td>';
        }
        output.innerHTML += '</tr>';    
    
    }
  });    
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers