Hi
Ultimate Aim: To upload multiple images using ajax using a PHP script which will be fired once an image is selected and then return the resulting URL for use in rest of my JS
http://peter-gosling.com/testupload/chooseimage.html simple form posts to http://peter-gosling.com/testupload/saveimage.php
This PHP script below currently gets the posted image and assigns it a random number file name and echos this
<?php
header("Access-Control-Allow-Origin: *");
$uploaddir = '/home/petergos/public_html/testupload/images/';
$uploadfile = $uploaddir . basename($_FILES['userfile']['name']);
$urlpath = "http://www.peter-gosling.co.uk/testupload/images/";
$temp = explode(".",$_FILES["userfile"]["name"]);
$newfilename = rand(1,999999999) . '.' .end($temp);
$newuploadfile = $uploaddir . $newfilename;
echo "<p>";
if (move_uploaded_file($_FILES['userfile']['tmp_name'], $newuploadfile)) {
$urlfile = $urlpath . $newfilename;
echo $urlfile;
} else {
echo "Upload failed";
}
?>
What I want to do is post my image via ajax but return the value back to my js file I'm not certain on the CORS issue Here's my first attempt
http://peter-gosling.com/testupload/
HTML
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input type="file" accept="image/*;capture=camera" name="taskoutputfile"></input>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$("input[name=taskoutputfile]").on("change", function (){
var fileName = $(this).val();
console.log(fileName);
get_image_url(fileName)
});
//UPLOAD IMAGE RETURN URL
function get_image_url(imageurl) {
var dataString = "url="+imageurl;
//datastring = $("input[name=sessiontitle]").val();
//AJAX code to submit form.
$.ajax({
type: "POST",
url: "http://www.peter-gosling.co.uk/testupload/saveimage2.php",
data: dataString,
cache: false,
success: function(html) {
alert(html);
}
});
}
</script>
</body>
</html>
PHP
<?php
header("Access-Control-Allow-Origin: *");
$uploaddir = '/home/petergos/public_html/testupload/images/';
$uploadfile = $uploaddir . basename($_POST['url']);
$urlpath = "http://www.peter-gosling.co.uk/testupload/images/";
$temp = explode(".",$_POST['url']);
$newfilename = rand(1,999999999) . '.' .end($temp);
$newuploadfile = $uploaddir . $newfilename;
echo "<p>";
if (move_uploaded_file($_FILES['userfile']['tmp_name'], $newuploadfile)) {
$urlfile = $urlpath . $newfilename;
return $urlfile;
} else {
echo "Upload failed";
}
/*
echo "</p>";
echo '<pre>';
echo 'Here is some more debugging info:';
print_r($_FILES);
print "</pre>";
*/
?>
Have attached all files
Any help would be really appreciated
Thankyou
