My first attempt at creating multiple instances of cfwindow on a page was less than desirable. I thought that nesting a cfwindow tag in a cfloop tag with the name attribute set to createUUID would be the best way to create a unique instance of the cfwindow, which I could then open with a link or a button. The result was a bloated, slow moving page that was absolutely unusable. When I viewed the source I found that for each instance of the cfwindow I created CF was generating an entirely new javascript block.

I quickly discounted the new cfwindow tag as useless for creating anything but a single instance on a page (like a login modal) and moved on to JQuery for my solution.

After watching Ray Camden's presentation on the CF AJAX functionality I got to thinking. Why can't I use javascript to create unique instances of cfwindows on the fly, client side?

Note that the following example is for those not yet running CF8.01 (bite the bullet and go install the update!).

Here's the script I came up with. Notice that I am using javascript to capture the current time in hours minutes and seconds, combining them, then using them as the window instances name. This will guarantee a unique window name. At least for 24 hours.

<script>
function makeWindow(ID) {
	var d = new Date();
	var curr_hour = d.getHours();
	var curr_min = d.getMinutes();
	var curr_sec = d.getSeconds();
	ColdFusion.Window.create(curr_hour + curr_min + curr_sec,"The Title","windowSource.cfm?ID=" + ID,
	{center:true,modal:true,width:800,height:600,resizable:false});
}
</script>

To trigger the script to create the window instance I just used the onClick method in a link. This can be used in the same way on a button. You can also call the function from inside JQuery, but I won't cover that here. Here's the link I used. Imagine that it is nested in a cfloop and ID is a column from a query.

<a href="##" onClick="makeWindow(#ID#)">Open Window</a>

For those running CF8.01 this javascript function will still work, but you'll want to take advantage of the refreshOnShow:true attribute. This will allow you to create a static name for your cfwindow and you can remove the date/time functions I used in my example. The window should refresh each time it is set to show. Here's an example of this.

<script>
function makeWindow(ID) {
	ColdFusion.Window.create("modalWindow","The Title","windowSource.cfm?ID=" + ID,
	{refreshOnShow:true,center:true,modal:true,width:800,height:600,resizable:false});
}
</script>

You can then instantiate the window with the same link as before.

That's it! Clean, easy and simple. Creating my cfwindows this way definitely reduces the size of the http request. Instead of loading the cfwindow library and creating a new code block for each instance of the window I want to create, I now load the library once, and have one block of script that handles all my window creation needs.

Edit: 6/22/08

I forgot to mention that you will need to include the following code above the script block or the window will never be created.

<cfajaximport tags="cfwindow">