Javascript upload & previews image not working on IE

Question

I have found a script that lets me upload an image with a <input type="file"> , and when an user loads a picture, it gets previewed in a <div> , this perfectly works on Chrome en FF, but IE simply does nothing... I don't know where the problem lies, and maybe someone here can help me :)

HTML/PHP :

<div id="Step_06_Content_Prev_Img_1" class="Step_06_Content_Prev_Img_1">        
   <div id="Pic_1" class="Pic_1">
      <span> Foto 1 : </span>
      <input type="hidden" name="MAX_FILE_SIZE" value="10000000" />
      <input name="file_1" type="file" onchange="changePic_1(this);" />

      <div id="Img_1_" class="Img_1_1">
         <img id="Img_1" class="Img_1" alt="Geen afbeelding geselecteerd!"/>
      </div>

   </div>
</div>

<div id="Pic_2" class="Pic_2">
   <span> Foto 2 : </span>
   <input type="hidden" name="MAX_FILE_SIZE" value="10000000" />    
   <input name="file_2" type="file" onchange="changePic_2(this);" />

   <div id="Img_1_" class="Img_1_1">
      <img id="Img_2" class="Img_2" alt="Geen afbeelding geselecteerd!" />
   </div>
</div>

JavaScript :

function changePic_1(input) 
{
    if(input.files && input.files[0]) 
    {
        var reader = new FileReader();

        reader.onload = function (e) 
        {
            $('#Img_1').attr('src', e.target.result).width("180px").height("180px");
            document.getElementById("Img_1").style.display = 'block';
            document.getElementById("Img_1_Text").style.display = 'none';
            document.getElementById("Img_1").style.visibility = "visible";
        };

        reader.readAsDataURL(input.files[0]);
    }
}

function changePic_2(input) 
{
    if (input.files && input.files[0]) 
    {
        var reader = new FileReader();

        reader.onload = function (e) 
        {
            $('#Img_2').attr('src', e.target.result).width("180px").height("180px");
            document.getElementById("Img_2").style.display = 'block';
            document.getElementById("Img_2_Text").style.display = 'none';
            document.getElementById("Img_2").style.visibility = "visible";
        };

        reader.readAsDataURL(input.files[0]);
    }
}

Answer 1

Refer the following link for the compatibility of the FileReader

http://caniuse.com/filereader

I think fileReader() is not compatible with your IE version which is why you are not getting any errors because it is does not recognize the fileReader() function.