How to use JQuery lightbox with cfimage
22 Apr 2011, Posted by in ColdFusion, JavaScript, jQuery, Web DevelopmentRecently I needed to pull images dynamically from a network drive, and be able to use JQuery lightbox with them. So I came up with a small function to assist me.
I wanted to use cfimage to accomplish this, but all I really wanted was the temporary filename ColdFusion generates to display the file to the screen. That way I could use it with regular HTML tags.
First, I performed a cfimage “Read” on the network drive location where the image was stored.
[cc lang=”cfm”]“APPLICATION.uploadPath” is a variable I use to store the actual file path where the images are stored.
“uploaded_photo” is the database field that contains the filename.
“newPhotoName” will now be assigned to something we really can’t make sense of. It will look something like this, “c[email protected]”. So what do we do with it?
Lets pass this string into our function.
[cc lang=”cfm”][/cc]
OK, so what does this function do?
What I’m really after here is the full URL path to the temporary ColdFusion image. So I do a “cfsavecontent” to capture the output as variable I can parse later.
Inside of my “cfsavecontent“, I use the “cfimage” tag with the action “writetobrowser“. This will actually give me the HTML markup for the image to display to the browser. You’ll wind up with something like this:
[cc lang=”html”]
[/cc]
Next, our function is going to strip out all of the HTML we don’t want.
[cc lang=”cfm”][/cc]
Now we have a fully usable image path we can use however we like. “http://www.your-url.com/CFFileServlet/_cf_image/_cfimg-4341467501479857784.PNG”
Finally, just use your variable in your HTML markup.
[cc lang=”html”]Hope this helps!
it works but you can obtain the same ruslt with less code in function.