Send $_FILE data to form input

Question

I have an event listener set up in jQuery $('#file').on("change", function() {}); .

This detects when image has been appended.

Image source is: data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQ... the plugin does this.

I just want to send that created image to file upload input in my html form. How can I do this?

Answer 1

Try something like this then:

<script type="text/javascript">
$(function(){
   $("plugin").change(function(e){
      $("input#image").val(img);
   });
})
</script>
<form>
  <input type="hidden" name="image" id="image" />
  <input type="submit" />
</form>
<?php
if(getenv("REQUEST_METHOD") === "POST"){
   $image = $_POST["image"];
   // do what you want
}
?>

The more information you give, the better we can help you. Also, it's worth trying things yourself as you will learn from mistakes you make.

Answer 2

Why don't you send it as an hidden input field? After you post the form, you can do whatever you like with it using php. Something like this:

<script type="text/javascript">
$(function(){
   $("plugin").change(function(e){
      $("input#image").val(e.image);
   });
})
</script>
<form>
  <input type="hidden" name="image" id="image" />
  <input type="submit" />
</form>
<?php
if(getenv("REQUEST_METHOD") === "POST"){
   $image = $_POST["image"];
   // do what you want
}
?>

Haven't tested this, but it should be enough to help you get going. If you want to display the image, just do something like this:

<img class="thumbnail" src="data:image/gif;base64,R0lGODlh9AEZAdUyAK6VZqBmUNjRrNSon+7">