I've followed a tutorial online for building a multi file uploader, added comments, everything running successfully as uploaded files move to the uploads folder and error messaging works. However while I can print_r the $uploaded array which displays the path and file name, what I really want to do is echo this path in an html < img/ > tag something like this :
if($uploaded) {
$name = $uploaded['filename']['name'];
move_uploaded_file($uploaded['filename']['tmp_name'], $name);
echo "<img src='" . $name . "' />";
}
And display the images out on the page. Here's the file.
upload.php
<?php
if(!empty($_FILES['files']['name'][0])) {
$files = $_FILES['files'];
$uploaded = array();
$failed = array();
$allowed = array('png', 'jpg');
//Loops files and collects file name
foreach($files['name'] as $position => $file_name) {
//Collects temporary location size and error of looped file
$file_tmp = $files['tmp_name'] [$position];
$file_size = $files['size'][$position];
$file_error = $files['error'][$position];
//Collects file extention
$file_ext = explode('.', $file_name);
$file_ext = strtolower(end($file_ext));
//References allowed extensions array
if(in_array($file_ext, $allowed)) {
// checks for errors otherwise else statements
if($file_error === 0) {
// checks file size otherwise else statements
if($file_size <= 2097152 ) {
// uniqid generates new file based on time stamp name
// defines server file destination folder
$file_name_new = uniqid('', true) . '.' . $file_ext;
$file_destination = 'uploads/' . $file_name_new;
//new destination for temporary file
if(move_uploaded_file($file_tmp, $file_destination)) {
$uploaded[$position] = $file_destination;
} else {
$failed[$position] = "[{$file_name}] failed to upload.";
}
} else {
$failed[$position] = "[{$file_name}] is too large.";
}
} else {
$failed[$position] = "[{$file_name}] errored with code {$file_error}.";
}
} else {
$failed[$position] = "[{$file_name}] file extension '{$file_ext}' is not allowed.";
}
}
//prints $uploaded array if successful
if(!empty($uploaded)) {
print_r($uploaded);
}
//prints $failed else statments otherwise
if (!empty($failed)) {
print_r($failed);
}
}
?>
Form Index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>untitled</title>
<meta name="generator" content="TextMate http://macromates.com/">
<meta name="author" content="">
<!-- Date: 2014-08-02 -->
</head>
<body>
<form action="upload.php" method="post" enctype="multipart/form-data">
<input type="file" name="files[ ]" multiple>
<input type="submit" value="Upload">
</form>
</body>
</html>
OK, after playing about with your code I have the following that works OK for me.
index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>untitled</title>
<meta name="generator" content="TextMate http://macromates.com/">
<meta name="author" content="">
<!-- Date: 2014-08-02 -->
</head>
<body>
<form action="upload.php" method="post" enctype="multipart/form-data">
<input type="file" name="files[ ]" multiple>
<input type="submit" value="Upload">
</form>
</body>
</html>
Upload.php
<?php
//
if(!empty($_FILES['files']['name'][0])) {
$files = $_FILES['files'];
$uploaded = array();
$failed = array();
$allowed = array('png', 'jpg');
//Loops files and collects file name
foreach($files['name'] as $position => $file_name) {
//Collects temporary location size and error of looped file
$file_tmp = $files['tmp_name'] [$position];
$file_size = $files['size'][$position];
$file_error = $files['error'][$position];
//Collects file extention
$file_ext = explode('.', $file_name);
$file_ext = strtolower(end($file_ext));
//References allowed extensions arry
if(in_array($file_ext, $allowed)) {
// checks for errors otherwise else statments
if($file_error === 0) {
// checks file size otherwise else statements
if($file_size <= 2097152 ) {
// uniqid generates new file based on time stamp name
// defines server file destination folder
$file_name_new = uniqid('', true) . '.' . $file_ext;
$file_destination = 'uploads/' . $file_name_new;
//new destination for temporary file
if(move_uploaded_file($file_tmp, $file_destination)) {
$uploaded[$position] = $file_destination;
} else {
$failed[$position] = "[{$file_name}] failed to upload.";
}
} else {
$failed[$position] = "[{$file_name}] is too large.";
}
} else {
$failed[$position] = "[{$file_name}] errored with code {$file_error}.";
}
} else {
$failed[$position] = "[{$file_name}] file extension '{$file_ext}' is not allowed.";
}
}
//prints $uploaded arry if successful
if(!empty($uploaded)) {
}
//prints $failed else statments otherwise
if (!empty($failed)) {
//print_r($failed);
}
if($uploaded) {
foreach ($uploaded as $image)
{
echo "<img src='".$image."' />";
}
}
}
?>
Well you are basically typing <img src='apple.jpg'/> Which most likely leads to nothing.
What you really want to do : <img src='/path/to/apple.jpg/>
and in PHP : echo "<img src='/path/to/".$name." />'";