Multiple File Upload with Flex and PHP
I needed to create a FLEX file uploader with PHP on the server side. So I googled “flex upload”, found this site 9 Flex File Upload Examples Visited and found what I was exactly looking for on the first link (Flex File Upload Component).
So, I grabbed and did play a little bit by adding this stuff:
- Filtering for the file type
- Limiting the max file size
- Modifying the progress bar in the bottom to show overall progress status instead of individual upload status
- Add progress bar on individual file upload
Anyway, try the demo by clicking the screenshot above and if you like it feel free to use it (as usual, do right click then view source will get you to the source or just click here).
Just don’t forget to include the credit for the guys at weblog.cahlan.com as the most work were done by them 
Update: Sun, 08.03.2008 – modified the upload.php to save the uploaded images in the database. I need it for collecting sample pictures of my other demo. If you want to delete your upload, go here and you will find it under “Not Categorized” category for the successful upload. Drag and drop your picture(s) to the bar at the buttom of the screen to delete your uploaded picture(s).
July 18th, 2008 at 2:56 am
This is pretty interesting, but I don’t have a clue how to make a unit test with it. I downloaded the source, but it doesn’t help much. i’m on php and a complete flex noob.
Any suggestions?
Thanks, Tudor
July 18th, 2008 at 9:41 am
Thanks for posting the Flex File Upload example. This is so cool… Please post more flex examples as I am all over flex now
July 18th, 2008 at 10:12 am
tudor, read the coding cowboys’ blog. I only did a little bit modification on their code so the stuff that they explain there will still apply and hopefully will help you to shed some light
Feel free to ask if you still have question later.
July 31st, 2008 at 4:48 pm
Finally cracked it. But it doesn’t work under MacOS or Linux
August 1st, 2008 at 6:43 am
Anyone tested on MacOS ?
August 1st, 2008 at 9:49 pm
Sorry Tudor, I don’t have access to MacOS or Linux to try this on. Is there anyone else out there that can point out why this doesn’t work on MacOS or Linux?
Btw, when you said it doesn’t work, what did you see?
August 6th, 2008 at 4:05 pm
the file browser pops out, I select a file and nothing happens. I suspect a silly windows / issue. email me for more info. I’d really want to get this fixed.
August 7th, 2008 at 4:37 pm
I had a chance to try it on Mac. I got successful upload on jpg files. I got a problem on PNG files. I didn’t try to upload gif files.
I solved the problem with the png files and updated the source code. Hope we’re having the same issue and I am fixing the right issue.
August 8th, 2008 at 5:23 am
You managed to upload a .jpg? I wonder why. Did you update the source code in the demo also?
August 8th, 2008 at 5:35 am
I just tested under Linux: works on FF2 (without file progress bar) and crashes on FF3
August 8th, 2008 at 6:51 am
Challenge would be great if u provide multiple downloading…mena one data grid
25 row
25 download button..
each button open dialog box and saved related fiel into computer
during saving.. status will will ‘downloading….”. for perticular row rest of row only “download”
if 5 downloading i runnig then 5 row will have ‘downloading” label..
try this and let me know if u can…
August 8th, 2008 at 9:29 am
Yeah, I updated the source code in the demo. Did you manage to upload in Mac with the new code? What browser you are using?
August 8th, 2008 at 11:53 am
see my comment above. no, I wasn’t able to upload in mac.
August 11th, 2008 at 10:27 am
I am sorry Tudor. I am able to upload on MAC using FF and Safari. Can you give me more detail information and probably some screenshots?
August 14th, 2008 at 3:10 am
Thanks for the info. This was very helpful, keep up the good work.
August 18th, 2008 at 4:42 pm
what part of the code specifically did you change in order to get the png files to work? is it the typeList function?
August 18th, 2008 at 5:54 pm
Yes, it is the typeList function.
August 19th, 2008 at 12:57 pm
Your code worked great for me on a Mac when I did a test upload with your demo on your site. Using the same code on my server, no dice. Same problem as before, so I am guessing it is an issue with my server. What are your server-side specs? This may be the key to Mac users trying to use and debug this. I am using Apache 2.2, php 5.2, os=FreeBSD 6.2
August 19th, 2008 at 6:06 pm
For reference to those who have issues on a Mac using this code, I may have figured something out. The PHP file and SWF is working fine. The problem is where session information may be introduced. For some reason this uploader will not work if you are posting to a php file, in our case we are using cakephp, and you are doing a session check. It’s bazaar. From what I see it’s a bug with the fileupload, not necessarily THIS file upload component. I have it working now on a Mac with Firefox, uploading PNG and Jpegs, because there is no session info associated with the php file.
August 19th, 2008 at 7:43 pm
Chad, thanks for your input. In case you still need the server side spec, the demo is running on Apache 2.0.63, php 5.2.6, OS Linux 2.6.24.2.dn.am
August 27th, 2008 at 12:08 am
Hendra, I am trying to use your multiple upload example and want to extend the example to display the image before uploading — fairly new to flex trying to figure the best way. Any pointers ?
August 27th, 2008 at 9:59 am
I am new to Flex myself
Anyway, I did a search on Google and find this:
http://swfupload.org/forum/generaldiscussion/334. Let me know if it is helpful.
October 1st, 2008 at 5:09 pm
Hi,
Can you help me please?
I get: Security Error in uploading file. when I try to upload a jpg file. I’ve changed only the hostname in the mxml file. I am running in windows xp and wamp php server.
Any idea as to why I am getting this error message?
Thanks.
October 1st, 2008 at 5:17 pm
Hi,
To add up to my last message, when I’ve tried to access the php file directly I get this error message: Parse error: syntax error, unexpected $end in D:\wamp\www\fileUpload\upload.php on line 59
I am not good in php, so I don’t know how to find the problem.
Thanks.
October 2nd, 2008 at 9:50 am
For your first issue, adding cross-domain policy file will most likely solve your problem. Read this to understand more about the cross-domain policy file: http://kb.adobe.com/selfservice/viewContent.do?externalId=tn_14213
For the second issue, there is only 58 lines of codes in upload.php. If you don’t mind, send me your upload.php so I can take a look at it.
October 4th, 2008 at 3:09 pm
Hi all,
The PHP error message could come from your PHP configuration, I you use Wamp Server on local, replace this : <? by this <?php and that <?= by <?php echo …
So you could have :
function return_result($success,$errors,$data) {
echo(”");
?>
<?php
}
function echo_errors($errors) {
for($i=0;$i
<?php
}
}
October 23rd, 2008 at 12:07 pm
Hi… error in uploading a file.
The error is: “Security Error in uploading file.”
What is???
My upload.php file is:
<?php
$errors = array();
$data = “”;
$success = “false”;
function return_result($success,$errors,$data) {
echo(”");
?>
<?
}
function echo_errors($errors) {
for($i=0;$i
PLEASE HELPP-me
URL of the script: http://www.uaiinformatica.com.br/upload2/
October 29th, 2008 at 3:00 pm
Try to put crossdomain.xml in the folder where you put the swf file. The contains more or less should be like this:
<?xml version=”1.0″?>
<!DOCTYPE cross-domain-policy SYSTEM “http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd”>
<cross-domain-policy>
<allow-access-from domain=”www.uaiinformatica.com.br” secure=”false” />
</cross-domain-policy>
October 31st, 2008 at 11:58 am
BEcause in FIrefox the session is LOST ?
November 3rd, 2008 at 4:15 pm
FYI: I did run the upload in Firefox 2 and 3 and got no problem with it.
November 10th, 2008 at 7:14 am
i want to comlete code
November 22nd, 2008 at 10:59 am
Hi,
I have a problem with compiling the demo under Adobe Flex Builder 3.
I’ve got an eroor in FileUploadApp_Demo.mxml at 10 line: “Access of undefined property Constants”. What should I to do to compile this properly?
November 29th, 2008 at 2:00 pm
I am going to use your app. but I want to know how to get a email notification
when someone uploads a video.. Just somthing simple that will tell me when
there is a new video. Because I will have to recode it, and place it in a different folder.
I wanted to use ffmpeg but I can not do so for this project, since the client purchased a
shared hosting accoutn with godaddy. And his amount of useage would not be enough for
the amount of money he would have to pay to do that option.
Anyway… so simple question. once file is uploaded, how can I send an email to me letting me know of the file upload.
thanks
YhwhDesign
November 29th, 2008 at 2:36 pm
how do you even get this to work with the files you download?
Do you simply upload them into a file?
what….
Thanks
December 16th, 2008 at 6:47 am
i am currently working on php.i have downloaded ur code.but cannot use it.i do work on dreamweaver5.so ho plz mention how to use it along with any other tools(if required).
December 17th, 2008 at 11:22 am
After downloading the code I put them in server directory. I run this http://localhost/wedding/Playground/upload.php and I ended geting the message below..! ” false No action was requested” Which file should I run to test? Anything needed to run flex?
December 18th, 2008 at 1:28 am
is there any wrong in php code.actually the message appears file(s) have been uploaded but there is no file upload in the root directory or anywhere else.
March 6th, 2009 at 7:10 am
Great post dude,
Thanks alot……for sharing.
You are so helpful……
April 7th, 2009 at 2:23 pm
Hi, thanks for the changes…quick question.
In your code you have:
_strUploadScript += “?id=” + Application.application.parameters.id + “&key=” + Application.application.parameters.key;
Where are these variables being pulled from (the Application.application.parameters.id and Application.application.parameters.key?
Thanks,
Dan
May 8th, 2009 at 1:19 pm
I have built a similar Multiple Image Upload component but a problem that I am running into is that it will not work on a mac. I have compared your concepts to mine and they seem to be the same but when I try yours on a mac it work like it should. Did you ever run into this problem when developing this component? If you did how did you fix it?
June 2nd, 2009 at 11:59 pm
how can we insert .jpeg images, in this.
I tried it but it giving error.
thank you
June 3rd, 2009 at 12:06 am
hello frnds,
here we can stop or cancel the uploading at any time, but could we do it for specific files only?
when i cancelled uploading for 2nd file and again starts uploading it should start with that 2nd file, but here it uploading all files again.
September 24th, 2009 at 3:56 pm
buy Asacol New York
September 29th, 2009 at 1:52 am
http://www.bloogle.net – Bloogle – Your opinion about this?
October 25th, 2009 at 11:25 am
Hi, first time long time. Check out this company they did an excellent job. TermLife
November 1st, 2009 at 12:00 pm
Где модератор?
December 8th, 2009 at 7:44 pm
jaimee grubbs
jaimee grubbs
http://club.vodila.net/tiger_woods/ tiger woods pictures
microsoft lifecam
December 14th, 2009 at 10:56 am
I have found two little bugs=>
Change the following function:
private function scrollFiles():void {
listFiles.verticalScrollPosition = listFiles.selectedIndex;
listFiles.validateNow();
}
By
private function scrollFiles():void {
if (_arrUploadFiles.length > 0){
listFiles.verticalScrollPosition = listFiles.selectedIndex;
listFiles.validateNow();
}
}
And in the removeFiles():void function change:
if (_arrUploadFiles.length > 0)
listFiles.selectedIndex = 0;
else
listFiles.selectedIndex = -1;
By
if (_arrUploadFiles.length > 0)
listFiles.selectedIndex = 0;
else{
listFiles.dataProvider = ”;
listFiles.selectedIndex = -1;}
December 16th, 2009 at 4:53 am
I want to upload other file types, for example: .mov, .psd, .ai, …
I have tried the following:
uploader.typeList = [new FileFilter("Other files (*.rtf, *.txt, *.pdf, *.zip, *.rar, *.doc, *.xsl, *.docx, *.xslx, *.ppt, *.pps, *.flv, *.mp3, *.avi, *.mov, *.wmv, *.psd, *.ai, *.odt, *.ods)", "*.rtf;*.txt;*.pdf;*.zip;*.rar;*.doc;*.xsl;*.docx;*.xslx;*.ppt;*.pps;*.flv;*.mp3;*.avi;*.mov;*.wmv;*.psd;*.ai;*.odt;*.ods", "RTF;TXT;PDF;ZIP;RAR;DOC;XSL;DOCX;XSLX;PPT;PPS;FLV;MP3;AVI;MOV;WMV;PSD;AI;ODT;ODS")];
I can add rtf, txt, zip, rar, doc without problems… But I can’t add .mov, .psd, .ai files
Does anybody knows the solution?
December 16th, 2009 at 5:35 am
A solution could be that you comment next rules in the validateFile function :
for (var i:int = 0; i < _extensions.length; i++){
if (ext.toString() == _extensions[i].toString()){
break;
}
}
if (i == _extensions.length){
return "*Bestandstype wordt niet ondersteund";
}
Then it works without the error…
December 18th, 2009 at 6:01 am
Hi nto All
My computer worked not correctly, many errors. Please, help me to fix buggs on my PC.
I used Windows 2003.
Thx,
Jursosque
January 18th, 2010 at 3:08 am
I have a problem on IE 8 on my Windows 7. I can select the files I wish to upload, but when I then click “open”, they are not displayed in the list, so I can’t upload them…
Does anybody has the same problem and how can I solve it?
February 18th, 2010 at 5:23 am
Hello!
Flex gives me an error on this line:
“private const _strDomain:String=Constants.domain;”
Help please…. I really need this!
Thanks!
February 18th, 2010 at 6:02 am
Hello again! I got the previous error fixed… But now I got a new one!
I uploaded the app to my test server, but when i upload a jpg it gives a flash error:
“Error #2044: Unhandled uploadIoError:. text=Error #2038: File I/O Error. URL: mysite.com/upload.php?id=undefined&key=undefined”
Anyone can help me? It seems like it’s not passing the variables…
Thank you!
February 21st, 2010 at 11:49 am
HI Alexandre
I get the same error: “private const _strDomain:String=Constants.domain;”
How did you fix this?
Thank you!
February 24th, 2010 at 6:04 am
Hi Mark!
You have to go to the src\com\album\util folder and edit the .as file. Change the domain to your own.
February 26th, 2010 at 12:42 am
Has anyone done the above example in flex 4. I am getting a Error #1034: Type Coercion failed: cannot convert spark.components. Any help is appreciated. Thanks
August 4th, 2010 at 4:01 pm
Hello all. I have just downloaded the file, in trying to get this to work. The folder that i downloaded had the following contents
1. FileUploadApp_Demo
2. com (folder that contained flashdev)
3. php file
Now when i bring these files into flex, i get an error – “Access of undefined property Constants”.
I notice a couple of guys above had this problem and they said the fix was in the album folder, although i dont have this ?
Have i downloaded the wrong code ? I got mine from here ->http://soegianto.com/demo/srcview/fileupload_demo/index.html
October 19th, 2010 at 9:46 am
the best thing about IE8 is that it is quite stable than previous releases of Internet Explorer.;;
December 11th, 2010 at 10:07 pm
Trying to compile your code and getting error msg:
Access of undefined property Constants.
private const _strDomain:String = Constants.domain;
(line 10 of FileUploadApp_Demo.mxml)
According to the post above, the solution is to “go to the src\com\album\util folder and edit the .as file. Change the domain to your own.” I am unable to find any such folder, but really want to make this work. I am totally new to FLEX, so please advise what I need to do to fix this.
Thanks,
Billy
December 19th, 2010 at 11:22 am
Hi,
Where can I download the swf file? I can’t get it working…
Thanks,
Luuk B.
April 3rd, 2011 at 2:57 pm
This is not working or making sense for me, probably because of my lack of experience with flex/flash (tho I know PHP fairly well); I must be making some major but simple mistake.
I unzipped the file downloaded from http://soegianto.com/demo/srcview/fileupload_demo/Playground.zip to a web accessible folder (visible to me at) //localhost/testupload/
I modified /testupload/upload.php to log requests
I modified /testupload/FileUploadApp_Demo.mxml to set _strDomain and _strUploadScript to my upload.php file
To test it, I copied your file FileUploadApp_Demo.html to that same folder.
Also history.htm, history.js ad AC_OETags.js
It appears to be willing to upload a file, but my PHP file is never called. I’m guessing that it’s uploading to your website.
Is there some step like compiling the mxml file to create a new swf, which is so obvious to flex/flash people that nobody mentions it?
If so, can somebody give the the quick hints? I was looking for a multiple file upload widget and this looks great, but I hope not to need to become a flex programmer to use it. (Tho I certainly wouldn’t mind learning flex in the long run, I have limited hours to complete the current project and just want a working widget). I can handle the PHP end.
Thanks!
October 9th, 2011 at 11:35 am
That’s awesome ! I wonder how can I install it in my site.
Please give me the instructions
hezisisman@gmail.com