javascript - Image preview before posting -


the upload button in picture below allows user choose photo. image should display , next button used post request.

enter image description here

i doing in following way:

<form class="form-horizontal" role="form" method="post" action='{{url::route('postimage')}}' runat="server">     <div class="form-group">         <label class='col-md-4 control-label'>profile picture</label>         <div class='col-md-6'>                 <img src='/images/default.jpg' id='image' class="img-responsive img-circle img-thumbnail img_profile pull-left">                  <input type="file" name='profile_picture' id="file_id" class='hidden' >                <a href='#' class="btn btn-primary" onclick="document.getelementbyid('file_id').click(); return false;"><span class='glyphicon glyphicon-camera'></span> upload photo</a>          </div>     </div> 

my js code follows:

 function readurl(input) {      if (input.files && input.files[0]) {         var reader = new filereader();          reader.onload = function (e) {             $('#image').attr('src', e.target.result);         }          reader.readasdataurl(input.files[0]);     } }  $("#file_id").change(function(){     readurl(this); }); 

the next button not working. simple button type submit. might wrong it? highly appreciate help.


Comments

Popular posts from this blog

Magento/PHP - Get phones on all members in a customer group -

php - .htaccess mod_rewrite for dynamic url which has domain names -

Website Login Issue developed in magento -