multiple image upload field - php

Its pretty simple to add form fields for uploading files etc, but I am after one that I can highlight several files and upload them all in one field.
Is there a plugin of some sort that can allow me to do this? I cant find one, also, do v1 plugins work with v2?
I should be able to add the ability to show the files and delete them myself but if this was included it would be very nice.
Thanks.
EDIT: I am using CakePHP!

You can do that with normal php code
If you use multiple input fields you can set
name="file[]".
That will put them in an array when you upload them
($_FILES['file'] = array ({file_array},{file_array]..))
Or try
Plugin
Update: For Cakephp

Use uplodify it will allow you to upload multiple files
Refer this http://www.uploadify.com/demos/

in HTML5 you can use like below
<form action='#' method='post' enctype='multipart/form-data'>
<input name='uploads[]' type=file multiple>
<input type='submit'>
</form>
html5
using PHP

Well, you could just try using the attribute multiple="multiple" on your file input, and see how it goes. Most modern browsers support this, and those who don't would limit it to 1 file.
If you name it with brackets PHP will probably make it an array.
<input type="file" multiple="multiple" name="files[]" />

Related

Is there some way to change the default setting from All Files in the file upload dropdown?

I'm currently building a file upload method for a client that's going to be used by small children, so we're trying to eliminate as much room for error as possible. Is there a way I can change the default setting of the file upload dropdown from All Files to the filetypes we're allowing on the page? We've already got measures in place to keep users from uploading non-allowed files, this is just to make it extra clear so users don't waste time accidentally selecting the wrong filetype. Example:
I'd like to have the field the arrow is pointing to automatically show, say, .jpg and .pdf instead of All Files, for example.
Use the accept attribute of the input tag. So to accept only PNGs, JPEGs and GIFs you can use the following code:
<input type="file" name="myImage" accept="image/x-png,image/gif,image/jpeg" />
Or simply:
<input type="file" name="myImage" accept="image/*" />
Note that this only hits the browser to accept this code. I. E. Opera and ie9 does not support this
You can use the accept attribute on the <input> field:
<input type="file" … accept="image/png, image/gif">

Multiple file input image upload IE 8

Good Day, I have a form with multiple file input fields. I have a script that automatically adds another file input field on change. This is for a image upload functionality ( so that the user can upload multiple images in one go ). In Firefox, it works fine, but it fails on ie8.
this how the form looks like when many images were selected
form.html
<form class="ysForm" action="uploadImage.php" encType="multipart/form-data" method="post">
<input name="ys-file_0" class="ysFile" type="file" multi_selector="[object Object]"/>
<input name="ys-file_1" class="ysFile" type="file" multi_selector="[object Object]"/>
<input name="ys-file_2" class="ysFile" type="file" multi_selector="[object Object]"/>
</form>
uploadImage.php
foreach( $_FILES as $theFile ) {
//do image resize and save to a directory code
}
But uploadImage does not seem to get the image files.
Please help
According to other answers, such as the one here, IE8 doesn't support the multiple option for file inputs.
IE8 doesn't support multiple file uploading with
You can see this info:
IE8 - input (type="file") get files
http://social.msdn.microsoft.com/Forums/en-US/f0e72657-962f-4254-b95c-c47482401899/multiple-file-uploading-in-ie9-and-older-versions?forum=ieextensiondevelopment
Most modern browsers (including IE8) support multiple file uploading with a single dialog. The syntax is
<input type="file" multiple="true" name="upload" />
Your form will call your php script multiple times, once for each image.
That being said, I suggest using Uploadify, http://www.uploadify.com/, as it's a lot easier. There are also some fancy JQuery based solutions.

Posting an unknown number of files to php

I am currently working on php project where I need to upload files, but I have no way of knowing how many files the user will upload.
There will be one file upload by default on the form with a link to add another file upload. When the form is submitted how would I post all of the files to the php script if I don't know the number of files that are being uploaded.
Does it work in the same way as a checkbox array so you could have something like
<input type="file" name"myFile[]" />
<input type="file" name"myFile[]" />
Thanks for any help you can provide.
Yes, works fine.
try to do this, after post form with files:
<pre>
<?php print_r($_FILES['myFile']['tmp_name']); ?>
</pre>
You will get a array. Access each file info with their index:
$_FILES['myFile']['tmp_name'][0];
$_FILES['myFile']['tmp_name'][1];
Yes, it works exactly like a checkbox array.

How to remove files from upload array (before upload) via Javascript

In simplest terms, I have a file select form which allows for multiple files to be selected for upload:
<form enctype="multipart/form-data" method="post" id="image_upload_form">
<input type="file" multiple="multiple" id="image_upload" name="files_to_upload[]" onchange="ini_image_upload();" />
</form>
Once files are selected, I run a quick Ajax call to check the database if certain files have already been uploaded, make sure there's no invalid files, etc. and create an array of files that already exist/I don't want to upload.
Now, I am trying to REMOVE these unwanted, scummy files from my upload array (before the actual upload IE. form gets submitted).
How do I achieve this majestically feat?
I have one suggestion for you. It is better to use below for your
requirement for upload. Have a look onto below URL.It is really so easy to integrate into your existing system and lots of features available.
http://www.uploadify.com/
what are you going to validate files by? are you trying to remove files with like some tricky extenstions like .php, .asp, .aspx ? if so then in the form element you should add a onSubmit attribute and call a function from there. then in the function check all the file names and process them and remove them from the array then replace the upload array and then return true. it would submit the form.. I actually don't know how u can retrieve the filenames form the upload array but Im pretty sure that this solution should work.
good luck!

Upload multiple files with a single input element

I have a simple input for "file".
I was wondering how I go about making it so you can select multiple files using one input.
<input name="sliderfile" id="sliderfile" type="file" />
Basically, multiple select in one browse window.
Any help would be appreciated,
Thanks!
You can use the <input type="file"> with the multiple attribute.
<input name="sliderfile" id="sliderfile" type="file" multiple>
jsFiddle Example.
Note: IE6 won't like it.
You can use <input name="sliderfile" id="sliderfile" type="file" multiple /> though if you are considering those poor blokes using old versions of IE you may have to use JS to imitate something like this, there is a fash component that works in similar way, the component is known as swfupload, jQuery has some plugins based on it, popular one is uploadify
<input name="sliderfile[]" id="sliderfile" type="file" />
accessible with
$_FILES['sliderfile'][0];
$_FILES['sliderfile'][1];
$_FILES['sliderfile'][2];
....

Categories