image upload on change event of field - php

Question

I am using form action event to load image on server ,how can i identify return of method so that i can set backgound image of canvas element with that image???
<form id="imageform" class="form-horizontal" action="ajaximage.php" method="post" enctype="multipart/form-data" >
<div class="control-group">
<label class="control-label" for="InputImage">Upload Image for Liberary</label>
<div class="controls">
<span class="btn btn-file">
<input type="file" name="photoimg" id='fileImage' class="fileUpload" required />
<div id='preview' style=""></div> <!-- style="width: 90px;" onchange="this.style.width = '100%';" <div id='categoryImage' style='border:1px solid black; height:20px' ></div> --> <div id='libImage' style="display: none"></div> <div id='preview'></div> </span>
</div>
</div>
</form>
ajaximage.php
$valid_formats = array("jpg", "png", "gif", "bmp");
if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST")
{
$name = $_FILES['photoimg']['name'];
$size = $_FILES['photoimg']['size'];
//echo "<script>alert(".$name.")</script>";
if(strlen($name))
{
list($txt, $ext) = explode(".", $name);
if(in_array($ext,$valid_formats))
{
if($size<(1024*1024))
{
$actual_image_name = $txt.".".$ext;
$tmp = $_FILES['photoimg']['tmp_name'];
if(move_uploaded_file($tmp, $path.$actual_image_name))
{
echo "<img src='../products/".$actual_image_name."' class='preview'>";
}
else
echo "failed";
}
else
echo "Image file size max 1 MB";
}
else
echo "Invalid file format..";
}
else
echo "Please select image..!";
exit;
}

Answer 1

you can fire change event using following code with jQuery
$("document").ready(function(){
$("#fileImage").change(function() {
$( "#imageform" ).submit();
});
});
OR you can use this also
$('#fileImage').on("change", function(){ $( "#imageform" ).submit(); });
see Fiddle