[EXTENSION] FancyUpload

That was just me being lazy. The statements for the 2 scripts are as follows:


$Submit_Id = $_POST['submit_id'];

$query="UPDATE stories SET name = '$StoryName', school = '$School', description = '$Description' WHERE id = '$Submit_Id' ";


$Submit_Id = $_POST['submit_id'];

move_uploaded_file($_FILES['Filedata']['tmp_name'], '../uploads/' . $Submit_Id . '/' . $_FILES['Filedata']['name']);

The fact that the files still upload, but to /uploads/, probably means that $Submit_Id in server/script.php does indeed hold a null value, but I don’t know why it would. I set it exactly the same way as in the other script which works fine.

Keep in mind that the initial form action is server/script.php, and it’s only once FancyUpload is complete that the action is switched to submit_script.php and submitted.

have you tried merging the two pieces of code and join them in the script that works?

Yes, but FancyUpload calls script.php once for each file uploaded (5 files --> script.php is run 5 times). This led to lots of blank database entries.

I guess I could try submitting the information at the top of the script in an if statement and checking if exactly that information exists already?

Also, I guess since $_POST[‘submit_id’] doesn’t work in server/script.php it probably wouldn’t be able to read the other fields either.

Are there any tutorials for FU that deal with this? I’m sure someone else has needed to submit text along with their pictures…

in the official forum there may be something, but try using the "data" option of fancyupload and passing the submit_id


data: (object|string: defaults to null) Key/data values that are sent with the upload requests.

i think this will solve the problem

That sounds exactly like what I’m looking for. Where do I add this code? I’ll look around their website, but if you know it’d probably be much quicker. Thanks.

the code goes in the declaration of fancy like

window.addEvent('domready', function() { // wait for the content

	// our uploader instance 


	var up = new FancyUpload2($('demo-status'), $('demo-list'), { // options object

		// we console.log infos, remove that in production!!

		verbose: true,


		// url is read from the form, so you just have to change one place

		url: $('form-demo').action,


		// path to the SWF file

		path: '../../source/Swiff.Uploader.swf',


		// remove that line to select all files, or edit it, add more items

		typeFilter: {

			'Images (*.jpg, *.jpeg, *.gif, *.png)': '*.jpg; *.jpeg; *.gif; *.png'



		// this is our browse button, *target* is overlayed with the Flash movie

		target: 'demo-browse',

                //adds extra data


retrieve this in the script.php by calling


that’s it


hope it helps

Reading about this, this is definitely what I need. When I add the following line it breaks my script, though. It’s probably punctuation since I’m new with php:

data: {'Submit_Id=':'$('submit_id').get('value')'}

if you’re generating the page inside PHP, you can write

data: {'Submit_Id=':<?php echo "'$my_value'"; ?>}

if not, use some callback of fancy to add values to the “data” option…this one i don’t remember how to perform because i’ve just seen in fancy’s website and never tested



I am generating it in a php page. What should $my_value be? I’m using:

<input type='hidden' name='submit_id' value='$ID_VARIABLE'>

Would it just be submit_id?

Or since I already have the variable declared on the page from before ($submit_id), why can’t I use this:

echo "		data: {'Submit_Id=':'" . $submit_id . "'}\n" ;

The form breaks. Are you sure that’s the correct place to declare that?

it would be $ID_VARIABLE

i’ve found the code i told you in an old-old-old file around here…hehe

the following callback helps to add the value to "data" option before sending the file

'onBeforeStart'=>"function() {

var hash = {};

document.cookie.split(/;\s*/).each(function(cookie) {

cookie = cookie.split('=');

if (cookie.length == 2) {

hash[decodeURIComponent(cookie[0])] = decodeURIComponent(cookie[1]);




data: {cookieName: hash['myfield'], myfield: document.id('myfield').get('value')}



PS. code was originaly taken from fancy’s forum

OK, the exact code for the form input is:

echo "	   <input type='hidden' name='submit_id' value='" . $submit_id . "'>\n" ;

This works for the other script, so the variable $submit_id is correct.

I changed the top of the page to look like this:

echo "	var up = new FancyUpload2($('demo-status'), $('demo-list'), { // options object\n" ;

echo "		// we console.log infos, remove that in production!!\n" ;

echo "		verbose: true,\n" ;

echo "		\n" ;

echo "		// url is read from the form, so you just have to change one place\n" ;

echo "		url: $('form-demo').action,\n" ;

echo "		\n" ;

echo "		// path to the SWF file\n" ;

echo "		path: 'source/Swiff.Uploader.swf',\n" ;

echo "		\n" ;

echo "		// remove that line to select all files, or edit it, add more items\n" ;

echo "		typeFilter: {\n" ;

echo "			'Images & Videos (*.jpg, *.jpeg, *.gif, *.png, *.mpg, *.mpeg, *.avi, *.wmv, *.flv, *.3gp)': '*.jpg; *.jpeg; *.gif; *.png; *.mpg; *.mpeg; *.avi; *.wmv; *.flv; *.3gp'\n" ;

echo "		},\n" ;

echo "		// this is our browse button, *target* is overlayed with the Flash movie\n" ;

echo "		target: 'demo-browse',\n" ;

echo "		// Adds id data\n" ;

echo "		data: {'Submit_Id=':'" . $submit_id . "'}\n" ;

echo "		onLoad: function() {\n" ;

This doesn’t work. It doesn’t remove the fallback and none of the buttons work.

finally fucking got it to work – what a pain in the ass, I wish they did a better job on the forum/FAQ section explaining this stuff.

data: 'Submit_Id='+$('submit_id').get('value'),

The problems were the missing comma at the end, and the fact that the <input> was using ‘name’ and not ‘id’ to specify that it was ‘submit_id’.

I’m testing single file upload. In the sample code that comes with the extension, I tried to upload a non-jpg file, it’s showing the same message whether the file is jpg or not. How can it display ‘File Type must be jpg’ as shown in the code at the end of the function in UploadAction.php:

public function run() {

..... some codes here ....

    $return = array(

          'status' => '0',

          'name' => 'File Type must be jpg'




echo json_encode($return);


How do you access the status and name in this array in ‘onFileComplete’? I don’t know jquery that well and don’t know how to access data returned by that function.


fancyupload uses mootools javascript framework

I’ve never tried to do this in single upload, but the mootools code is like

'onTheCallbackYouWant'=> "function(file, response) {

                var json = new Hash(JSON.decode(response, true) || {});

                if (json.get('status') == '1') {

                        file.info.set('html', 'Success: ' + json.get('name') );

                } else {

                        file.info.set('html', 'Error: ' + (json.get('error') ? (json.get('error') + ' #' + json.get('code')) : response));



also, i’m not sure if you’ll be able to change the text below the picture, maybe you could put a custom div, which would receive the status messages

hope it helps


Hi all,

I need two upload buttons on one page. I played around for a while but only one of the two is recognized.

Does anyone tried this too and has a solution?

Has anyone had any success validating other form fields with FancyUpload?

I have 1 dropdown and 1 textbox that are required and I would like to check if they’re filled in before uploading the files.

How would I go about doing this?

Thanks for the reply. Managed to get it to work for single upload based on the pseudo code provided:

'onFileComplete' => "function(file) {

    var json = new Hash(JSON.decode(file.response.text,true) || {} );

    if (json.get('status') == 1) {

        window.alert('Upload done!');


    else {

        if (file.response.error) {

           window.alert('Failed - ' + this.fileList[0].name + '. Please try again. (Erro: #' + this.fileList[0].response.code + ' ' + this.fileList[0].response.error + ')');

        } else {





In the function that does the upload, just add ‘error’ key to the result array for error message and that will be displayed when there are errors.

Hope this helps someone.


thanks for sharing the solution with us!!




How can i use single upload in the same page?

When i add two singlebutton upload, the second button doesnt work :(