File uploads with DropZoneJS

Hi, I am trying to implement DropZoneJS into an existing form on a lucee website, anyone having a example code of the server code for the upload.cfm (or whatever filename) triggered by the DropZoneJS script?

Also, wouldn’t it be great to have such functionality in lucee?


doesn’t FileUpload work?

Mmm didn’t knew that, do you know of any examples to use it?
What is the difference in using this vs <cffile action="uploadall"?

I’d assume they both are pretty much identical, if you use script syntax, the only difference being that <cffile action="uploadall"> saves all files in the request’s form scope out to the target directory.

FileUpload being equivalent to <cffile action="upload"> or file action="upload"

Ah ok, thanks. I guess I have to dive in the DropZoneJS documentation some more, will update if I have an example.

So… this was in fact very simple, just check for the form.file value on the upload page and do stuff like you always do. Thanks for the answers. :sunglasses:

1 Like

does the documentation need updating? PRs are so very welcome

You mean the DropZoneJS documentation? If so, I could indeed provide them a simple example on how to implement it on Lucee, right now it’s not available as an serverside example on their page.

Nah, the Lucee documentation

You mean updating the Lucee documentation with a DropZoneJS example?

No, I just mean if the Lucee documentation you looked at didn’t answer your question in terms of how to solve the problem in terms cfml, could it be improved?

1 Like

Ah ok, no in fact my question and this thread was only about how to connect DropZoneJS to Lucee serverside, so that’s nothing to mention in the Lucee docs, thanks again!

1 Like

In the template that uses DZ you will have a container that looks something like this:

div class=“dropzone” id=“DocDropzone” action=“upload.cfm”

Here is a basic upload.cfm:

cfset cUploadFolder = “c:\uploadfolder”

cfif Not DirectoryExists( cUploadFolder )
cfset DirectoryCreate( cUploadFolder )

cffile action=“upload” filefield=“form.file” destination="#cUploadFolder#" nameconflict=“MAKEUNIQUE”