title: Preview thumbnail of an xls, xlsx, doc, etc file before upload
body: <p>I'm having hard time figuring out how to preview the file thumbnail image something like that before uploading it. So when i browse a file using file chooser and select the file i wanted to upload it will display its corresponding preview, like .txt, .csv, .xls, or xlsx, etc. Is there a way to achieve this in any ways? Simple ways or complex ways may work. How do i achieve something like this one? </p>
  
  <p>html file</p>
  
  <pre><code>&lt;form id="form1" runat="server"&gt;
      &lt;input type='file' id="imgInp" /&gt;
      &lt;img id="blah" src="#" alt="your image" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>here the js</p>
  
  <pre><code>function readURL(input) {
      if (input.files &amp;&amp; input.files[0]) {
          var reader = new FileReader();
  
          reader.onload = function (e) {
              $('#blah').attr('src', e.target.result);
          }
  
          reader.readAsDataURL(input.files[0]);
      }
  }
  
  $("#imgInp").change(function(){
      readURL(this);
  });
  </code></pre>