Fieliakitpase
New Member
I want to write a file upload that does work in IE But Two types of code that I'm Write problem in IE.Please help where you can File upload writing that work in IE?
Type 1
Problem Not Support File Api In IE (The trick is not to use it?)\[code\] <!DOCTYPE html><html><head runat="server"> <title></title> <script src="http://stackoverflow.com/questions/15664069/Scripts/jquery-1.6.2.js" type="text/javascript"></script> <script type="text/javascript"> function updateSize() { var nBytes = 0; var nFiles=0; oFiles = document.getElementById("uploadInput").files; nFiles = oFiles.length; for (var nFileId = 0; nFileId < nFiles; nFileId++) { nBytes += oFiles[nFileId].size; } var sOutput = nBytes + " bytes"; // optional code for multiples approximation for (var aMultiples = ["KiB", "MiB", "GiB", "TiB", "PiB", "EiB", "ZiB", "YiB"], nMultiple = 0, nApprox = nBytes / 1024; nApprox > 1; nApprox /= 1024, nMultiple++) { sOutput = nApprox.toFixed(3) + " " + aMultiples[nMultiple] + " (" + nBytes + " bytes)"; } document.getElementById("fileNum").innerHTML = nFiles; document.getElementById("fileSize").innerHTML = sOutput; } // end of optional code </script></head><body> <form id="form1" runat="server"> <p><input id="uploadInput" type="file" name="myFiles" onchange="updateSize();" multiple /> selected files: <span id="fileNum">0</span>; total size: <span id="fileSize">0</span></p><p><input type="submit" value="http://stackoverflow.com/questions/15664069/Send file"></p> </form></body></html>\[/code\]Type 2
Problem Not Support document.getElementById('fileToUpload').files[0](The trick is not to Get Files[0]?)\[code\] <script src="http://stackoverflow.com/questions/15664069/Scripts/jquery-1.4.1.js" type="text/javascript"></script> <script type="text/javascript"> function fileSelected() { var file = document.getElementById('fileToUpload').files[0]; if (file) { var fileSize = 0; if (file.size > 1024 * 1024) fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + 'MB'; else fileSize = (Math.round(file.size * 100 / 1024) / 100).toString() + 'KB'; document.getElementById('fileName').innerHTML = 'Name: ' + file.name; document.getElementById('fileSize').innerHTML = 'Size: ' + fileSize; document.getElementById('fileType').innerHTML = 'Type: ' + file.type; } } function uploadFile() { var fd = new FormData(); fd.append("fileToUpload", document.getElementById('fileToUpload').files[0]); var xhr = new XMLHttpRequest(); xhr.upload.addEventListener("progress", uploadProgress, false); xhr.addEventListener("load", uploadComplete, false); xhr.addEventListener("error", uploadFailed, false); xhr.addEventListener("abort", uploadCanceled, false); $.post("UploadHandler.ashx"); //xhr.open("POST", "UploadHandler.ashx"); xhr.send(fd); } function uploadProgress(evt) { if (evt.lengthComputable) { var percentComplete = Math.round(evt.loaded * 100 / evt.total); document.getElementById('progressNumber').innerHTML = percentComplete.toString() + '%'; document.getElementById('prog').value = http://stackoverflow.com/questions/15664069/percentComplete; } else { document.getElementById('progressNumber').innerHTML = 'unable to compute'; } } function uploadComplete(evt) { /* This event is raised when the server send back a response */ alert(evt.target.responseText); } function uploadFailed(evt) { alert("There was an error attempting to upload the file."); } function uploadCanceled(evt) { alert("The upload has been canceled by the user or the browser dropped the connection."); } </script></head><body> <form id="form1"> <div> <label for="fileToUpload"> Select a File to Upload</label> <input type="file" name="fileToUpload[]" id="fileToUpload" onchange="fileSelected();" /> </div> <div id="fileName"> </div> <div id="fileSize"> </div> <div id="fileType"> </div> <div> <input type="button" onclick="uploadFile()" value="http://stackoverflow.com/questions/15664069/Upload" /> </div> <div id="progressNumber"> </div> <progress id="prog" value="http://stackoverflow.com/questions/15664069/0" max="100.0"></progress> </form></body>\[/code\]Please Help Help
Type 1
Problem Not Support File Api In IE (The trick is not to use it?)\[code\] <!DOCTYPE html><html><head runat="server"> <title></title> <script src="http://stackoverflow.com/questions/15664069/Scripts/jquery-1.6.2.js" type="text/javascript"></script> <script type="text/javascript"> function updateSize() { var nBytes = 0; var nFiles=0; oFiles = document.getElementById("uploadInput").files; nFiles = oFiles.length; for (var nFileId = 0; nFileId < nFiles; nFileId++) { nBytes += oFiles[nFileId].size; } var sOutput = nBytes + " bytes"; // optional code for multiples approximation for (var aMultiples = ["KiB", "MiB", "GiB", "TiB", "PiB", "EiB", "ZiB", "YiB"], nMultiple = 0, nApprox = nBytes / 1024; nApprox > 1; nApprox /= 1024, nMultiple++) { sOutput = nApprox.toFixed(3) + " " + aMultiples[nMultiple] + " (" + nBytes + " bytes)"; } document.getElementById("fileNum").innerHTML = nFiles; document.getElementById("fileSize").innerHTML = sOutput; } // end of optional code </script></head><body> <form id="form1" runat="server"> <p><input id="uploadInput" type="file" name="myFiles" onchange="updateSize();" multiple /> selected files: <span id="fileNum">0</span>; total size: <span id="fileSize">0</span></p><p><input type="submit" value="http://stackoverflow.com/questions/15664069/Send file"></p> </form></body></html>\[/code\]Type 2
Problem Not Support document.getElementById('fileToUpload').files[0](The trick is not to Get Files[0]?)\[code\] <script src="http://stackoverflow.com/questions/15664069/Scripts/jquery-1.4.1.js" type="text/javascript"></script> <script type="text/javascript"> function fileSelected() { var file = document.getElementById('fileToUpload').files[0]; if (file) { var fileSize = 0; if (file.size > 1024 * 1024) fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + 'MB'; else fileSize = (Math.round(file.size * 100 / 1024) / 100).toString() + 'KB'; document.getElementById('fileName').innerHTML = 'Name: ' + file.name; document.getElementById('fileSize').innerHTML = 'Size: ' + fileSize; document.getElementById('fileType').innerHTML = 'Type: ' + file.type; } } function uploadFile() { var fd = new FormData(); fd.append("fileToUpload", document.getElementById('fileToUpload').files[0]); var xhr = new XMLHttpRequest(); xhr.upload.addEventListener("progress", uploadProgress, false); xhr.addEventListener("load", uploadComplete, false); xhr.addEventListener("error", uploadFailed, false); xhr.addEventListener("abort", uploadCanceled, false); $.post("UploadHandler.ashx"); //xhr.open("POST", "UploadHandler.ashx"); xhr.send(fd); } function uploadProgress(evt) { if (evt.lengthComputable) { var percentComplete = Math.round(evt.loaded * 100 / evt.total); document.getElementById('progressNumber').innerHTML = percentComplete.toString() + '%'; document.getElementById('prog').value = http://stackoverflow.com/questions/15664069/percentComplete; } else { document.getElementById('progressNumber').innerHTML = 'unable to compute'; } } function uploadComplete(evt) { /* This event is raised when the server send back a response */ alert(evt.target.responseText); } function uploadFailed(evt) { alert("There was an error attempting to upload the file."); } function uploadCanceled(evt) { alert("The upload has been canceled by the user or the browser dropped the connection."); } </script></head><body> <form id="form1"> <div> <label for="fileToUpload"> Select a File to Upload</label> <input type="file" name="fileToUpload[]" id="fileToUpload" onchange="fileSelected();" /> </div> <div id="fileName"> </div> <div id="fileSize"> </div> <div id="fileType"> </div> <div> <input type="button" onclick="uploadFile()" value="http://stackoverflow.com/questions/15664069/Upload" /> </div> <div id="progressNumber"> </div> <progress id="prog" value="http://stackoverflow.com/questions/15664069/0" max="100.0"></progress> </form></body>\[/code\]Please Help Help