ColdFusion 9 added a snazzy little Ajax-based (well, Flash based to be truthful) multi-file uploader. Just in case you haven't actually seen it, here is a quick snap shot of what it looks like:
I've done a few blog posts on this topic already. Today a reader sent in an interesting question. While the control provides a way to limit the total file size of uploads (using the maxuploadsize attribute), there is no direct way to limit the size of individual file uploads. This blog entry will show one way that can be accomplished. I'll be using jQuery for my solution but please note that this is not a requirement.
Ok, so the first problem we run into is that there is no support for noticing when a file is added to the queue. If there was, we could listen for that and simply throw an error then. The next problem is that there is no support for a "pre"-upload event. You get support for an upload complete event - but not one for right before the uploads begin. Luckily we have a way to work around this. We're going to disable the upload button and use our own logic to fire off the uploads. I'll show the entire template below and then walk you through what it does.
if(!oneTooBig) ColdFusion.FileUpload.startUpload('myfiles'); });
}); </script> </head>
<cffileupload name="myfiles" maxuploadsize="10" hideuploadbutton="true"> <br><br> <input type="button" id="uploadBtn" value="Upload Mah Filez!">
First - notice how in the cffileupload control I've used the hideuploadbutton attribute. As you can guess, this removes the button you would normally use to upload all the files. I've added my own button, uploadBtn, that will be used instead.
That's it. You can see here in this screen shot how the button was removed.