I have the most simple case of image upload. When I run this as a separate example it DOES work. When I incorporate the same .js code into my project's javascript code, and try the upload from my html page (.js and .php codes identical, id's and names adjusted etc.), it doesn't work.
html:
<html>
<head>
<title>HTML5 File API</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div id="main">
<h1>Upload Your Images</h1>
<input type="file" name="images" id="images"/>
<input type="submit" id="submitImages" onclick="submitImages()">
<div id="response"></div>
<ul id="image-list">
</ul>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="upload.js"></script>
</body>
</html>
javascript:
function submitImages(){
if (window.FormData) {
formdata = new FormData();
}
file = document.getElementById('images').files[0];
if (!!file.type.match(/image.*/)) {
if (formdata) {
formdata.append("images[]", file);
}
}
if (formdata) {
$.ajax({
url: "upload.php",
type: "POST",
data: formdata,
processData: false,
contentType: false,
success: function (res) {
console.log(res);
}
});
}
}
php:
<?php
foreach ($_FILES["images"]["error"] as $key => $error) {
if ($error == UPLOAD_ERR_OK) {
$name = $_FILES["images"]["name"][$key];
move_uploaded_file( $_FILES["images"]["tmp_name"][$key], "uploads/" . $_FILES['images']['name'][$key]);
}
}
echo "<h2>Successfully Uploaded Images</h2>";
?>
The message I get from server when I attempt the upload from my project:
POST-->POST:
Source
-----------------------------2656620091882 Content-Disposition: form-data; name="images[]"; filename="dock_2.jpg" Content-Type: image/jpeg ÿØÿáa"Exif��MM�*��
etc.
POST-->RESPONSE:
<br />
<b>Notice</b>: Undefined index: images in <b>C:\XAMPP\htdocs\Projects\DockMapper\add_edit_upload_images.php</b> on line <b>3</b><br />
<br />
<b>Warning</b>: Invalid argument supplied for foreach() in <b>C:\XAMPP\htdocs\Projects\DockMapper\add_edit_upload_images.php</b> on line <b>3</b><br />
<h2>Successfully Uploaded Images</h2>
It seems that something is sent to the server, but that it is not received on the server. When I run: print_r($_FILES); the array is empty. I spent probably two days over this and I couldn't find the problem. Any suggestions? Big thanks.