Home/ Questions/Q 8177361
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T23:29:20+00:00

I want to display the image before uploading.I tried the following code but it

  • 0

I want to display the image before uploading.I tried the following code but it is working only in firefox.but i need to make it work in IE.Could any one suggest me the best solution for this.i am giving my code below could any one figure out where i went
I googled nearly one whole day.But couldnt find my solution
Here is my code

enter code here

function loadname(img, previewName) {
      var isIE = (navigator.appName == "Microsoft Internet Explorer");
      var path = img.value;
      var ext = path.substring(path.lastIndexOf('.') + 1).toLowerCase();
      if (ext == "gif" || ext == "jpeg" || ext == "jpg" || ext == "png") {
          if (isIE) {
              alert(path);
              $('#' + previewName).attr('src', path);
          } else {
              if (img.files[0]) {
                  var reader = new FileReader();
                  reader.onload = function (e) {
                      $('#' + previewName).attr('src', e.target.result);
                  }
                  reader.readAsDataURL(img.files[0]);
              } 
          }
      } 
  }

My html is

 <body><form method="post" > 
<input type="file" class="file" onchange="loadname(this,'previewimg')" id="file" /><img src="about:blank" name="previewimg" id="previewimg" alt="" style="width:2in; height:2in"/> 


</form>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    For security reasons IE9 does not support accessing of files on the client computer, that’s why you are not seeing any preview. You would need to upload the image onto your server and then display it.

    BIRD’S VIEW

    One way could be that on upload, show a progress bar while using ajax to save the file to a temporary folder on your server with the image name as a temporary ID and store the ID it in the database(so that you can delete it later) and then display it in the image control. If you need to delete the file later just delete it by using the ID or if you need it save it, move it to your images folder.

    • 0