AJAX loading gif

[CraigR]

I created a php script to allow upload of an image, together with resize and thumbnail creation.

This works fine, but the person I am doing it for would like a visual indicator that the upload is in progress.

Using the YUI tools, and looking at some other forums, I managed to piece together a working sample, but i am struggling a bit with the javascript.

The problems arise with the upload handler.

When using ff, i don't get any problems, but with ie i get a response popup with lots of text.

attached is the relevant js code. If anyone can give me a few pointers I would be very grateful

var $E = YAHOO.util.Event;
var $ = YAHOO.util.Dom.get;
var $D = YAHOO.util.Dom;
function init(){
var onUploadButtonClick = function(e){
//the second argument of setForm is crucial,
//which tells Connection Manager this is a file upload form
YAHOO.util.Connect.setForm('uploadImage', true);

var uploadHandler = {
upload: function(o) {
$D.setStyle('indicator', 'visibility', 'hidden');

alert(o.responseText);

}
};
$D.setStyle('indicator', 'visibility', 'visible');
YAHOO.util.Connect.asyncRequest('POST', 'uploadcode.php', uploadHandler);

document.uploadImage.upload.disabled = true;
document.uploadImage.upload.value = "Uploading...";
};
YAHOO.util.Event.on('upload', 'click', onUploadButtonClick);
}

YAHOO.util.Event.on(window, 'load', init);
</script>

[Danilo Celic]

I'm not quite familiar with the YUI library.

A quick look at the code I see that you have an alert that displays o.responseText, isn't that the "popup with lots of text" that you're seeing?

Beyond that, you will need to post a link to your page as this small snippet does't give the full story of what is actually happening.