Valums AjaxUpload and Wordpress wp_handle_upload

Question

I'm trying to implement the new version of AjaxUpload in my wordpress options panels and metaboxes... though I am not convinced I should change from the old version which I had working. this is the jauery that is calling the uploader function:

var uploader = new qq.FileUploader({
// pass the dom node (ex. $(selector)[0] for jQuery users)
element: document.getElementById('file-uploader'),
// path to server-side upload script
action: ajaxurl,

params: { action: 'upload_callback', id: 'image', }, });

i remembered the ajaxurl and passing action to later be used as a function name from my attempt w/ the previous version. It seems to function properly in the sense that that function IS getting called.

and then my callback function is

function childtheme_upload_callback() {
 $stuff = htmlspecialchars(serialize($_POST));
 die( "hey: " . $stuff );

}

add_action('wp_ajax_upload_callback', 'childtheme_upload_callback'); 

this function was where i was attempting wp_handle_upload but it was always empty so I set about trying to debug it by checking if anything was ever coming through. but no matter what i do $_POST and $_FILES are empty. even tho firebug says the post request looks like this:

http://localhost/plagueround/wp-admin/admin-ajax.php?qqfile=12_col.gif&action=upload_callback&id=image

and firebug says the post "source" looks like:

Source GIF89aü���ÿêêÿÓÓÿÿÿÿåå,����ü��9©Ë8£´Ú+¸ûm HÈê ¡®×Þغ;ûéÄÐP9Éݲé\�;

which i had presumed to be the image? but at this point i have no idea. has anyone successfully applied the new http://valums.com/ajax-upload/ Ajax Upload with Wordpress's wp_handle_upload?

Answer 1

hi,

So Maybe..Just maybe its this
params: { action: 'upload_callback', id: 'image', }, });
There is an EXTRA comma after your last }..it should be....
params: { action: 'upload_callback', id: 'image', }});

Also have you tried all the trouble shooting tips from http://valums.com/ajax-upload/ If the upload doesn't complete, saying failed.

• Set the debug option of the FileUploader to true.
• Open the page where you have a FileUploader.
• Open developer console in your browser.
• Try to upload the file. You should see a server serponse. It should be {success:true} for completed requests. If it's not, then you have a problem with your server-side script.

Wonder if that helps?