Type code in to a text input form, how?

Question

I want to know the best way of writing out my "$imagepath" in to this input

This is my upload script

<?php
        if(isset($_POST['submit'])){
          if (isset ($_FILES['new_image'])){
              $imagename = $_FILES['new_image']['name'];
              $source = $_FILES['new_image']['tmp_name'];
              $target = "temporary_images/".$imagename;
              move_uploaded_file($source, $target);

              $imagepath = $imagename;
              $save = "temporary_images/" . $imagepath; //This is the new file you saving
              $file = "temporary_images/" . $imagepath; //This is the original file

              list($width, $height) = getimagesize($file) ; 

              $modwidth = 350;                         
              $modheight = 100; 

              $tn = imagecreatetruecolor($modwidth, $modheight) ; 
              $image = imagecreatefromjpeg($file) ; 
              imagecopyresampled($tn, $image, 0, 0, 0, 0, $modwidth, $modheight, $width, $height) ; 

              imagejpeg($tn, $save, 100) ; 

              $save = "temporary_images/sml_" . $imagepath; //This is the new file you saving
              $file = "temporary_images/" . $imagepath; //This is the original file

              list($width, $height) = getimagesize($file) ; 

              $modwidth = 80; 
              $modheight = 100; 

              $tn = imagecreatetruecolor($modwidth, $modheight) ; 
              $image = imagecreatefromjpeg($file) ; 
              imagecopyresampled($tn, $image, 0, 0, 0, 0, $modwidth, $modheight, $width, $height) ; 

              imagejpeg($tn, $save, 100) ; 
            echo "Large image: <img src='temporary_images/".$imagepath."'><br>"; 
            echo "$imagepath"
          }
        }

And this is my form

<form>
 <input name="animeinput" id="animeinput" size="20" class="textbox">
</form>

Answer 1

Note that there can often be an issue with caching and timing when doing this (so if you are having problems actually seeing your image after submitting your form then see below), I guess this has something to do with the image not being in place by the time the resulting page is loaded. I got around this issue by updating my image with jquery/ajax.

Once the form is posted and image uploaded I save a reference to the image in a hidden tag #large_image. Then use this jquery....

$(document).ready(function(){

    //read in hidden reference to image URL
var large_photo = $("#large_image").val();

   //display relevent image (use placeholder if no image uploaded yet)
if (large_photo != "") {
    $("#photo_holder").html('<img src="' + large_photo + '" />');
} else {
    $("#photo_holder").html('<img src="noimagefound.png" />'); 
}

});

In your case then, instead of echoing the image src you would echo a hidden tag with a path to the image.

Hope this helps :)

Answer 2

If you've got the var available to the markup:

<form>
   <input name="animeinput" id="animeinput" size="20" class="textbox" value="<?php echo htmlspecialchars($imagePath); ?>" />
</form>