javascript - show details of the file before file upload -
i want populate table dynamically filename, filesize , operations delete file once user selects file upload, showing details of file selected upload, in table format after user selects file using jsp, javascript. have tried below code, i'am not sure how file size , perform delete operation without upload has performed.whenever user choose file upload,a table should generate showing details of file file size,file path, name of file etc before user submits form. please find similar scenario in http://jsfiddle.net/s98tw/4/
jsp code:
<table border="1"> <tr> <td> <input type="file" name="fileupload" size="50" id="file1" onchange="addfiledata(this)" multiple /></td> </tr> </table> <table border="1"> <tr> <th>sno</th><th>filename</th><th>filesize</th><th>action</th> </tr> <tr><td><input type="text" name="sno" id="sno"/></td> <td><input type="text" name="filename" id="filename"/></td> <td><input type="text" name="filesize" id="filesize"/></td> <td><a href="delete">delete</a></input></td> </tr> </table>
javascript code:
function addfiledata(field){ var file_name = document.getelementbyid("file1").value; document.getelementbyid("filename").value=file_name; }
take @ javascript file type. can file web file api.
document.getelementbyid("file1").onchange = function() { var file = this.files[0]; document.getelementbyid("size").innerhtml = file.size + " bytes"; document.getelementbyid("name").innerhtml = file.name; };
here's fiddle example: http://jsfiddle.net/n3zx7/
as deleting -- can't delete files user's computer. it's prevented browser security (and lack thereof methods deleting local files).
you can, however, path file using browser-specific implementations of *fullpath
eg. file.mozfullpath
or file.webkitfullpath
Comments
Post a Comment