title: How to submit base64 string of an uploaded image using only jquery
body: <p>Here are the jquery codes that i've written</p>
  
  <pre><code>$(function(){
    // Prepare the preview for profile picture
        $("#profile_image").change(function(){
            $("#message").empty(); // To remove the previous error message
            var file = this.files[0];
            var imagefile = file.type;
            var match= ["image/jpeg","image/png","image/jpg"];
            if(!((imagefile==match[0]) || (imagefile==match[1]) || (imagefile==match[2])))
            {
              $('#wizardPicturePreview1').attr('src','/images/houses/default.png');
              $("#message").html("&lt;p id='error'&gt;Please Select A valid Image File&lt;/p&gt;"+"&lt;h4&gt;Note&lt;/h4&gt;"+"&lt;span id='error_message'&gt;Only jpeg, jpg and png Images type allowed&lt;/span&gt;");
              return false;
            }
            else
            {
              var reader = new FileReader();
              reader.onload = function (e) {
                $('#wizardPicturePreview1').attr('src', e.target.result).fadeIn('slow');
                  //getting the base64 string of the uploaded image
                  var imageso =  e.target.result;
                  console.log('Encoded image:', imageso);
              };
              reader.readAsDataURL(this.files[0]);
            }
        });
  
  
    $('form').submit(function() {
      // submit the encoded base64 string of the uploaded image 
      $('.hidden-image-data').val(imageso);
  
      var formValue = $(this).serialize();
      $('#result-data').text(formValue);
  
      // Prevent the form from actually submitting
      return true;
    });
  });
  </code></pre>
  
  <p>   </p>
  
  <p>I am getting the encoded image in console with the imageso variable in the change() function but it is nullable In the submit() function, the console tells me that the imageso variable is not declared while it is already declared. The problem is, how to get that base64 string of the uploaded image in the submit funtion using only JQuery without using Ajax?</p>