Home › Forums › General Discussion

SWFUpload 2.1.0 inside AJAX

March 4, 2008 - 4:17pm — corie

Hi, I'm a bit new to AJAX and this is my first attempt at integrating SWFUpload.

I was able to get SWFUpload to work on a normal page, but when I put it inside an AJAX called page the flash file does not load and when I try to swfu.selectFiles() I get the error: Could not find Flash element.

I'm using the window.onload event, but I also tried the DocumentReady plugin with the same results.


var swfu;
window.onload = function() {
var settings = {
flash_url : "/photos/js/swfupload/swfupload_f9.swf",
upload_url: "/photos/images/add", // Relative to the SWF file
post_params: {"PHPSESSID" : "<?php echo session_id(); ?>"},
file_size_limit : "100 MB",
file_types : "*.*",
file_types_description : "All Files",
file_upload_limit : 100,
file_queue_limit : 0,
debug: true
};

swfu = new SWFUpload(settings);
};

document.getElementById("BrowseButton").onclick = function () { swfu.selectFiles(); };

‹ How can I set a custom file name? SOLVED - Need Help With Mysterious IO Error ›
March 4, 2008 - 4:55pm — corie

Update

I took out the window.onload and now just have this.

var swfu;

var settings = {
flash_url : "/photos/js/swfupload/swfupload_f9.swf",
upload_url: "/photos/images/add", // Relative to the SWF file
file_size_limit : "100 MB",
file_types : "*.*",
file_types_description : "All Files",
file_upload_limit : 100,
file_queue_limit : 0
};

swfu = new SWFUpload(settings);

This will work and load the flash file if I call the page directly, but loading it with AJAX gives an error in prototype.js from the scriptaculous library.

Error is on line 225 of prototype.js (SWFUpload is not defined) and looking at Firebug it's like prototype is trying to eval() the script code.

-Corie

March 4, 2008 - 5:46pm — corie

Resolved

I figured it out. I had to move the script and the js includes outside of the AJAX called file so I just created an init.js and pass my settings to that function whenever I need to create an instance.

-Corie

March 4, 2008 - 8:03pm — gyphie
gyphie's picture

Stupid Stupid Authentiation Timeouts

I had an excellent response that solved the issue with Prototype (man I'm good Eye-wink ) and when I hit post I was logged out and it was lost (no really, it was).

Here is the fix to the Prototype library that will let you load JS files using Ajax.

Replace the evalResponse function with this:

evalResponse: function() {
    try {
        var script = (this.transport.responseText || '').unfilterJSON();
        if (window.execScript) { // Eval correctly in IE
            window.execScript(script);
            return;
        } else { // Eval correctly every where else
            return window.eval(script);
        }
    } catch (e) {
     this.dispatchException(e);
    }
},

Tested in IE 6 & 7 and FF2 & FF3 (Windows XP) with Prototype 1.6.0.2

Disclaimer: Modifying the Prototype library could break other functionality. Use this solution at your own risk. I am not a Prototype developer.

March 4, 2008 - 10:54pm — john010117

Thanks for the fix

I was scratching my head for several hours because an error popped up (that said "EXCEPTION: message: int_settings has no properties"). Then I've applied your fix, and voila! The error message was gone.

August 22, 2008 - 7:33am — fongus

Resolved... give an exemple

hello,

i'm very bad in ajax, and i want to do the same thing without changing prototype...
can you give an example of what you have done to work it correctly ?

thanks in advance.

fong