Martyn Walker | Software Architect | Hiker And Hacker

swfupload makes uploading multiple files a snap and look good at the same time. It can be downloaded from Google Code with examples and implementation takes just a few minutes.

Firefox has a problem with the addPostParam call used to add post parameters dynamically. In normal use this is not important but if you wish to pass extra information with the files such as the name of a group to be associated with the files extra work is needed.

It appears only the second and subsequent calls work correctly, yet making two calls right away has no effect, so this won’t work:-

  swfu.addPostParam('groups',params);
  swfu.addPostParam('groups',params);

Firefox also fails if you change the visibility or display settings for container divs and yet these work ok in IE, so if you wish to hide the upload button until another HTML control is completed (such as a location selection filed or group name) you must move the button off the visible area (such as -1000px to the left) and return it afer a valid selection has been made.

How to bully swfupload to work in Firefox

The solution, found for me by my son an hero Adam, was to ignore the documentation and examples that come with it and load the swfu object only when needed and not to use window.onload. I have a function called updgroupval() that is called by the onclick event of a series of checkboxes, the first time this is called the swfu object is loaded:-

function updgroupval(ctl,id) {
	if(ctl.checked) {
		ctl.value = id;
	} else {
		ctl.value = '';
	}
	var params='';
        //a2s converts array into a csv string
	params = a2s(document.form1.group);
	var button = document.getElementById('SWFUpload_0');
	if(params != '') {
		if(swfu) {
			if(button.style.position == "absolute") {
				button.style.position = 'relative';
				button.style.left='0px';
			}
			swfu.addPostParam('groups',params);
		}else{
			settings.post_params.groups = params; 
                        //Create object
			swfu = new SWFUpload(settings);        
		}
	} else {
		button.style.position = 'absolute';
		button.style.left='-100000px';
 
	}	
}

By creating the object after the page has loaded Firefox and the object manage to communicate with addPostParam in the way described in their documentation. Whether this is just a freak of the versions I am using or total nonsense I don’t care. Now I can demonstrate smooth and stylish uploads in Firefox and IE and Chrome, all versions.