Handling File & Image Uploads
By Peter McNulty : 18-12-2004
4.30 (70)
Multiple File Uploads
There are two methods of allowing multiple file uploads. One is to create many file input fields all with different names and the other is to create an array of file input fields. The latter is much more preferred as, it allows us to easily allow for unlimited number of file uploads.
We now have a new form to allow for these multiple file uploads:
And it looks like this:
From looking at the code, you can see the 'array' of file input fields. We simply name them as we would name array elements in PHP. Now, we process the files just as we did before, however, as we have an array, we must refer to the index whilst we are uploading Hence, we must have a loop to look over all the elements in the array, and if they aren't empty, then complete the upload.
Not to difficult, is it? All we have changed, is we now have a for-loop which will loop over all 5 of the possible uploaded files, and then it will move the uploaded file to the correct directory. Every time we access $_FILES['ourFiles'] now, we must add [$i] to get the correct index of the array.
To end this article, just a quite note that if you now wanted to allowed 10 file uploads, all you have to do is add 5 more file fields to your form. The script already has the capability to handle unlimited uploads if you want. Although it is recommended that you restrict this using a variable such as $maxUploads = 10 and check this against the count of the array. I hope this article helps you to create a more dynamic, PHP based site!
We now have a new form to allow for these multiple file uploads:
Multiple File Upload
<html>
<head>
<title>File Uploader</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" enctype="multipart/form-data" name="upload">
Please enter up to 5 files to upload:<br>
<input name="ourFiles[]" type="file"><br>
<input name="ourFiles[]" type="file"><br>
<input name="ourFiles[]" type="file"><br>
<input name="ourFiles[]" type="file"><br>
<input name="ourFiles[]" type="file"><br>
<input name="submit" type="submit" value="Submit">
</form>
</body>
</html>And it looks like this:
From looking at the code, you can see the 'array' of file input fields. We simply name them as we would name array elements in PHP. Now, we process the files just as we did before, however, as we have an array, we must refer to the index whilst we are uploading Hence, we must have a loop to look over all the elements in the array, and if they aren't empty, then complete the upload.
Final Code
<html>
<head>
<title>File Uploader</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<?php
if (isset($_FILES['ourFiles'])) {
for ($i = 0; $i < count($_FILES['ourFiles']); $i++) {
if ($_FILES['ourFiles']['error'][$i] == UPLOAD_ERR_OK) {
$tempName = $_FILES['ourFiles']['tmp_name'][$i];
$fileName = $_FILES['ourFiles']['name'][$i];
$saveDirectory = 'uploads/';
if (@move_uploaded_file($tempName, $saveDirectory . $fileName)) {
echo 'File Successfully Uploaded!';
} else {
echo 'There was an error whilst uploading the file.';
}
} elseif ($_FILES['ourFiles']['size'][$i] > 100000) {
echo 'File is greater than maximum allow file size.';
}
}
} else {
?>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" enctype="multipart/form-data" name="upload">
Please enter up to 5 files to upload:<br>
<input name="ourFiles[]" type="file"><br>
<input name="ourFiles[]" type="file"><br>
<input name="ourFiles[]" type="file"><br>
<input name="ourFiles[]" type="file"><br>
<input name="ourFiles[]" type="file"><br>
<input name="submit" type="submit" value="Submit">
</form>
<?php
}
?>
</body>
</html>Not to difficult, is it? All we have changed, is we now have a for-loop which will loop over all 5 of the possible uploaded files, and then it will move the uploaded file to the correct directory. Every time we access $_FILES['ourFiles'] now, we must add [$i] to get the correct index of the array.
To end this article, just a quite note that if you now wanted to allowed 10 file uploads, all you have to do is add 5 more file fields to your form. The script already has the capability to handle unlimited uploads if you want. Although it is recommended that you restrict this using a variable such as $maxUploads = 10 and check this against the count of the array. I hope this article helps you to create a more dynamic, PHP based site!
<< Page 3 of 3
Build Your Own Database Driven Website Using PHP & MySQL
 |
|
Ads