php & jquery upload image and preview display instantly

Question

im looking forward to create an upload module where user can browse, click open and it will instantly display a preview of that image without having to click a submit button

Answer 1

<div class="control-group-upload">
     <div class="controls">
         <div class="fileupload fileupload-new" data-provides="fileupload">
             <div class="fileupload-new thumbnail" style="width: 200px; height: 150px;">
                 <img src="http://www.placehold.it/200x150/EFEFEF/AAAAAA&amp;text=no+image" alt="" />
             </div>
         <div class="fileupload-preview fileupload-exists thumbnail" style="max-width: 200px; max-height: 150px; line-height: 20px;"></div>
         <div>
             <span class="btn btn-file"><span class="fileupload-new">Select image</span>
             <span class="fileupload-exists">Change</span>
             <input type="file" class="default" />
         </span>
     <a href="#" class="btn fileupload-exists" data-dismiss="fileupload">Remove</a>
     </div>
</div>

The above code is from bootstrap. Check out metronic template of bootstrap.