Ask a Jedi: Another CFWINDOW Example

This post is more than 2 years old.

Ron Mouseleggings asks:

I am having a little difficulty figuring something out and wanted to see if you have any suggestions. I have created a result set of multiple phone numbers that I am looping over with each having a unique ID. Next to each phone number entry I have an EDIT button. When clicked I want it to pass a variable (ID/value) of that phone number to a single CFWINDOW element so the phone number can be edited and saved back to a database.

I thought this was a simple question, but it turned out to be a bit hairy. Let's start by taking a look at the code he tried.

<cfform> <cfloop from="1" to="#arrayLen(phoneArray)#" index="x"> <cfoutput> <tr> <th style="white-space:nowrap;">Phone #x#: </th> <td style="white-space:nowrap;">#phoneArray[x].p.phone_number#</td> <td><a href="##" onclick="javascript:ColdFusion.Window.show('pop_phone_edit')">EDIT</a></td> </tr> </cfoutput> </cfloop> </cfform>

<cfwindow center="true" modal="true" width="350" height="130" name="pop_phone_edit" title="Edit Phone Number" initshow="false" draggable="true" resizable="true" closable="true" refreshOnShow="true" source="phone_edit.cfm?varPersonID=#varPersonID#&varPhoneID=???????????" />

The code here isn't too complex. He loops over an array of data and for each one, he links to a JavaScript call to show the cfwindow defined at the bottom. As you can see though, he isn't sure how to tie the URL of the window to the item that was clicked. While there are multiple ways of solving this problem, here is how I did it.

First, lets start with the display. I created a hard coded array for my data as well:

<cfset phoneArray = [9,4,1]> <table> <cfloop from="1" to="#arrayLen(phoneArray)#" index="x"> <cfoutput> <tr> <th style="white-space:nowrap;">Phone #x#: </th> <td style="white-space:nowrap;">#phoneArray[x]#</td> <td><a href="##" onclick="javascript:showWin('#phoneArray[x]#')">EDIT</a></td> </tr> </cfoutput> </cfloop> </table>

Note that I've switched from opening the window to calling a new JavaScript function, showWin. I also removed his inline cfwindow. Now lets look at the JavaScript:

function showWin(id) { ColdFusion.Window.create('phoneedit','Edit Phone Number', 'test2.cfm?id='+id,{center:true}); }

Nothing too complex here either. Note that I pass in the ID value, and then construct my URL based on the ID. So again, nothing too crazy. I did have to add this to the top of my page since I didn't have an inline cfwindow tag:

<cfajaximport tags="cfwindow">

This creates a new problem though. When you click one link, it works great. When you click another link, the data in the window (I used a simple URL dump) doesn't change. What's happening here is that the same window object is being reused. We need a way to tell ColdFusion to make a new window object. We could name the window based on the ID - but then we could have multiple windows open at one time. I don't want that. So what can we do? Well ColdFusion does let us notice when a window is hidden (which is what happens when you close the window). I can add this:

ColdFusion.Window.onHide('phoneedit',cleanup);

This will then run a new function, cleanup, when the window is closed:

function cleanup() { ColdFusion.Window.destroy('phoneedit',true); }

Woot! This works perfectly. But lets add another wrinkle to this. What if I click a link, and don't close the window before I click another link? Unfortunately the window won't refresh. This can be a bit confusing. How about modifying showWin to see if the window already exists, and if so, close it? Turns out this isn't easy either! ColdFusion provides us with ColdFusion.Window.getWindowObject, but this will throw an error if the window doesn't exist. I could use a new variable that simply stores a true/fase. If true, it means the window exists, and I can use that to see if I can destroy the window. That's a bit hacky too. Instead I settled on a try/catch:

function showWin(id) { //do we have one? try { ColdFusion.Window.destroy('phoneedit',true); } catch(e) { }
ColdFusion.Window.create('phoneedit','Edit Phone Number', 'test2.cfm?id='+id,{center:true});
ColdFusion.Window.onHide('phoneedit',cleanup);

}

This will now attempt to destroy the window on every click. I'll paste the entire script below, but some quick thoughts. I'm really surprised that this is so simple. ColdFusion.Window.create needs an option to recreate the object if it already exists. I suppose we could also have used ColdFusion.navigate, but we would need to see if a Window object exists, and we are back to the problem I mentioned above. This needs to be simpler, I'd say, as the use case of 'popping a window to edit something' is probably one of the biggest uses of cfwindow. Anyway, here is the complete script. Enjoy.

<cfajaximport tags="cfwindow">

<script> function cleanup() { ColdFusion.Window.destroy('phoneedit',true); }

function showWin(id) { //do we have one? try { ColdFusion.Window.destroy('phoneedit',true); } catch(e) { }

ColdFusion.Window.create('phoneedit','Edit Phone Number', 'test2.cfm?id='+id,{center:true});
ColdFusion.Window.onHide('phoneedit',cleanup);

} </script>

<cfset phoneArray = [9,4,1]> <table> <cfloop from="1" to="#arrayLen(phoneArray)#" index="x"> <cfoutput> <tr> <th style="white-space:nowrap;">Phone #x#: </th> <td style="white-space:nowrap;">#phoneArray[x]#</td> <td><a href="##" onclick="javascript:showWin('#phoneArray[x]#')">EDIT</a></td> </tr> </cfoutput> </cfloop> </table>

Raymond Camden's Picture

About Raymond Camden

Raymond is a senior developer evangelist for Adobe. He focuses on document services, JavaScript, and enterprise cat demos. If you like this article, please consider visiting my Amazon Wishlist or donating via PayPal to show your support. You can even buy me a coffee!

Lafayette, LA https://www.raymondcamden.com

Archived Comments

Comment 1 by todd sharp posted on 9/26/2008 at 11:39 PM

I probably would have created the window onLoad (with script or with cfwindow) and just used ColdFusion.navigate() when editing (as you suggested).

Comment 2 by Ron McKay posted on 9/26/2008 at 11:43 PM

Ray, As I was just about to send an email to you when I got your blog post notice. I was thinking that I was close to figuring a solution but after reading your post I am not sure that my fix is not without issue so I wanted run this past you. This is what I came up with:

<cfform>
<cfloop from="1" to="#arrayLen(phoneArray)#" index="x">
<cfoutput>
<tr>
<th style="white-space:nowrap;">Phone #x#: </th>
<td style="white-space:nowrap;"> #phoneArray[x].p.phone_number#</td>
<td><a href="##" onClick="ColdFusion.Window.create('pop_phone_edit', 'Edit Phone Number','phone_edit.cfm?varPersonID=#varPersonID#&varPhone=#phoneArray[x].p.phone_number#',{x:100,y:100,height:300,width:400,modal:false,closable:true,draggable:true,resizable:true,center:true,initshow:true,minheight:200,minwidth:200 })">EDIT</a></td>
</tr>
</cfoutput>
</cfloop>
</cfform>

Will this present a problem of not allowing closed windows to be destroyed? I am keeping the window name the same for each listed item. My preliminary test seems to allow the variable value to be displayed properly in the window. Could this be a workable solution as well? Like I said, I feel that I might be missing something.

Comment 3 by Raymond Camden posted on 9/28/2008 at 7:12 AM

I'm surprised that works since it is using the same window name - but if it works, use it. :)

Comment 4 by Andy Sandefer posted on 9/28/2008 at 8:39 PM

I've hashed and rehashed this issue out so many times. Unless there is a solution requirement stating not to do it I would've made the window modal. Focus the user's attention on what they set out to do in the first place, edit a record. Second, why not use javascript to generate a unique id for the window each time a window is created? I had a massive post on how to do this very thing with a searchable cfgrid as my select list - it is hiding somewhere on this very blog from a few months back. I'll try to find it.
Event calls function, function gets key value from cfgrid and creates cfwindow, edit happens, ajax submit form function is called, callback calls function on parent page to close cfwindow and refresh grid.
As Darth Vader would say, "All too easy"

Comment 5 by Srinivas posted on 9/29/2008 at 12:24 PM

Ray,

I too has similar problem. So what i did is for each i giving the differnet name for the popup. I am just adding the current timestamp value to the popup window and each time user clicks it will create a new window. This is working fine for me.

Comment 6 by Ron McKay posted on 9/30/2008 at 9:20 PM

Ray, the solution I posted above appears to be working for me. One thing that might be making the difference on using the same window name is that when the pop_phone_edit window form is submitted...the action page actually performs a close on the window. This is what I have on my action page after I invoke my CFC that performs the update:

<script type="text/javascript">
ColdFusion.Window.onHide("pop_phone_edit", onhide);
ColdFusion.Window.hide("pop_phone_edit");
</script>

I know that without calling the "onHide and hide" function the window remains alive.

Comment 7 by Kate Maher posted on 10/28/2008 at 11:18 PM

Thanks for this, it works great!

But what if you want to delete a file when you close the cfwindow? For instance if when the window is opened a file is generated so the user can download it, but you don't want to store that file until the next time the user needs it and overwrites it. Is there any way to delete a specific file on close?

Comment 8 by Andy Sandefer posted on 10/28/2008 at 11:42 PM

@Kate
I would just use ColdFusion.Window.onHide and do your delete via a proxy through a js function.

Comment 9 by Kate Maher posted on 10/29/2008 at 12:11 AM

@Andy
I'm pretty sure you're not talking about putting CF *in* a JS function, and I don't think that JS can talk to the server to mess with server-side files. What do you mean 'via proxy'?

Comment 10 by Andy Sandefer posted on 10/29/2008 at 12:12 AM

@Kate
You most certainly can call a function wrapped in a cfc via cfajaxproxy in your javascript code.

Comment 11 by Dylan posted on 11/4/2008 at 3:43 AM

Just a quick note -- .destroy() isn't available until 8.1, so if you're like me, and were running an earlier version of CF8 on your development machine, you'll need to upgrade for this to work. Once I upgraded, it worked like a charm.

Comment 12 by Brett posted on 12/31/2008 at 2:39 AM

This is perfect. Had essentially the same issue come up. This worked great! Thanks for the post.

Comment 13 by George posted on 1/23/2009 at 7:57 AM

Hi Ray, I would like to Add Another URL Parameter called myTier to win.cfm?+id
Not quite sure how to do it.

function cleanup() {
ColdFusion.Window.destroy('mywin',true);
}

function showWin(id,myTier) {
//do we have one?
try {
ColdFusion.Window.destroy('mywin',true);
} catch(e) { }

ColdFusion.Window.create('mywin','Edit Phone Number', 'win.cfm?id='+id,{center:true,draggable:false,resizable:false});
ColdFusion.Window.onHide('mywin',cleanup);
}

Comment 14 by Raymond Camden posted on 1/23/2009 at 8:53 PM

The URL I used was a simple JavaScript string.

'win.cfm?id='+id

To add another one you would just add to the string

'win.cfm?id='+id+'&myTier='+myTier

This assumes a JavaScript called myTier exists.

Comment 15 by George posted on 1/24/2009 at 1:22 AM

Hi Ray, I am seeing the myTier key in the URL structure; however it is showing up as undefined. The ID has 2 values. This is what I have in my onClick event.
<a href ="##" onClick"javascript:showWin('#ID#','#myTier#');"> Not sure how to fix it.

Comment 16 by Raymond Camden posted on 1/24/2009 at 1:24 AM

Ok, what does Firebug tell you? Firebug, Firebug, Firebug. Sorry to be a nut, but Firebug is your # tool in the world. What I would do is this:

function showWin(id,myTier) {
console.log('i was sent id='+id+' and myTier='+myTier);
return;
}

Notice I got rid of the try/catch, create, etc. Keep it nice and simple.

Comment 17 by George posted on 1/24/2009 at 1:42 AM

Hi Ray, thanks as usual for your help. I got it. I see what I was doing wrong. I was missing my quotes around my variables.
<a href ="##" onClick"javascript:showWin('#ID#','#myTier#');">
Say, is there a good tutorial on how to use Firebug to debug javascript issues. If there is not I would love for you to do one at CFUNITED.

Comment 18 by Raymond Camden posted on 1/24/2009 at 1:48 AM

I'd be willing to bet you can Google and find a few online presos. I'm already giving 2 presos at CFUNITED, but if someone promises to buy me a few beers, I'd gladly give a quick unofficial look. To be honest, I've only scratched the surface of Firebug. I make use of console.log(simple messages) and console.dir(like a dump)

And of course I use ColdFire. You _do_ know what ColdFire is, right? (http://coldfire.riaforge.org)

Comment 19 by George posted on 1/24/2009 at 1:59 AM

Ray, you are on! As many beers as you would like.

Comment 20 by Raymond Camden posted on 1/24/2009 at 2:09 AM

I should warn you, the intelligence of my talking is inversely proportional to the amount of beer consumed.

Comment 21 by Andy Sandefer posted on 1/26/2009 at 7:48 PM

Amen!
Never code after that 3rd one!

Comment 22 by Dave posted on 7/24/2009 at 6:56 PM

Is it possible to use this script without the code that is in the window being located in a different file? (IE 'test2.cfm' in your example; can the code for that page be in the same file as the script that creates/destroys the window?)

I'm having an issue with a JS photo slideshow I'm implementing where it really wants to be on the same page. As soon as I try to load it from an external page, it dies. Being much more proficient in CF than I am in JS, it's easier for me to make the code work on the same page than it is to troubleshoot why it's not working from an external page.

Comment 23 by Andy Sandefer posted on 7/24/2009 at 8:38 PM

@Dave
You can put the source code for the cfwindow within cfwindow tags but I wouldn't. You're going to have to be more specific than "it dies" when describing why you don't want to put the code in another file. That "other" file can also reference js functions from the parent page so in my view it is very advantageous to create a js object to represent the cfwindow's various attributes, create show, hide and destroy functions (in the parent page) and then go from there.

Comment 24 by Les Mizzell posted on 8/7/2009 at 6:14 PM

I'm trying to modify this code to work for an editing system I'm slowly prototyping. Having some problems with it myself though...

A large number of potential records to be edited are being returned.So, I scroll to the one I want, and using the method in the original post above, click "edit". The window opens in place, but the page *jumps* back to the top, so now I can no longer see the window until I scroll back to the original record where the window has opened. How do I keep the original window "in place".

My database update is working fine from the window, but then my other issue is that I've not figured out how to update, in place, the data displayed on the original page.

Because of layout issues, and the fact that I need to edit way more stuff than I want to display in the returned set, CFGRID isn't going to work for me.

In short, I need to be able to scroll down to record 87, open the window, edit record 87, and the page stays in place and 87 shows the update after the form is submitted and the window closes.

Ideas?

Comment 25 by Andy Sandefer posted on 8/7/2009 at 6:21 PM

@Les
I'm sure that you can update the underlying grid by using

ColdFusion.Grid.refresh('mygridname', true);

in your js - you should put this code in your onHide js function that is responsible for closing the cfwindow control.

This will update the grid to reflect the update that you've made in the cfwindow's ajax submitter but unfortunately this will also cause the highlighted record to jump to the top of the page. You may be able to write some special sauce against EXT to then jump back and select your rec - but I'm not sure.
Good luck!

Comment 26 by Brett posted on 8/28/2009 at 7:39 PM

Ray
I took a look at this example and modified it to suit my own problem I was having however I have run into a problem. And to be honest I am a novice a JS so it might just be my own ignorance.
Code:
function comment_add(){
try {
ColdFusion.Window.destroy('acWindow',true);
} catch(e) { }

ColdFusion.Window.create('acWindow', 'Add A Comment','/comment.cfm',
{x:100,y:100,height:350,width:700,modal:false,closable:true,
draggable:true,resizable:true,center:true,initshow:true,
minheight:200,minwidth:200 });
ColdFusion.Window.onHide('acWindow',cleanup('acWindow'));
}

function cleanup(ix) {
ColdFusion.Window.destroy(ix,true);
}

As you can see I just adapted the code to accomidate reuse but the thing that is happening is I am getting an error from javascript saying there is an uncaught exception. The offending line of code if commented out is ColdFusion.Window.onHide('acWindow',cleanup('acWindow')); Now correct me if I am wrong but I thought you could pass a parameter to a handler function. If I take away the window name from the cleanup() there is no error. I'm stumped.

Comment 27 by Brett posted on 8/28/2009 at 8:09 PM

Ok I found a way to make it work but it is not really answering why it didn't work originally. I made it so that the created window could not be closed. On the opened window I added a Cancel button with a onclick function that called the destroy function for the window. I then took out the line of code for the onHide and removed the cleanup function altogether.

What I found out was everytime I fired off the comment_add() both the create() and onHide() where firing at the exact time. The way I figured this out was I put an alert() in the cleanup() to let me know it was being fired off. So basically something goffy is goning on with the onHide() somehow. Now I could be wrong, BUT I thought that the onHide function was like a function that was listening for a specific event namely the hide event to fire off before it would work. Now it could be the fact that IE {version 6.02} is mucking up the whole process as well. Kind of like how your blog is always displayed kind of jacked up for me at work.

Comment 28 by Raymond Camden posted on 8/28/2009 at 9:37 PM

I go out of my way to make the blog look bad in IE6. That's a "Feature" :)

Comment 29 by Chris posted on 10/8/2009 at 12:04 AM

I have used this and it works well with one small problem. Clicking the link to open the window forces the browser to the top of the page. If you have a long page with lots of data, then you have to scroll all the way back down to where the window is. Is there a way to have the browser not jump to the top of the page?

Comment 30 by Andy Sandefer posted on 10/8/2009 at 12:40 AM

@Chris
Center the cfwindow. Check the docs.

Comment 31 by Chris posted on 10/8/2009 at 1:08 AM

yes, I have that in the code already. It centers it in the window, but also forces the window to the top of a long page at the same time.
ColdFusion.Window.create('window_name','Window Title', 'windowurl.cfm?id='+id,{Center:true});

Comment 32 by Chris posted on 10/12/2009 at 10:33 PM

I found the solution to this... for anyone having the same problem. Add return false; to the javascript link

So, this <a href="##" onclick="javascript:showWin('#phoneArray[x]#')">EDIT</a>
becomes
<a href="##" onclick="javascript:showWin('#phoneArray[x]#'); return false;">EDIT</a>

works like a charm.

Comment 33 by Mik Muller posted on 7/8/2010 at 12:34 AM

I'm having similar issues. I need to create a new cfwindow for each productid whenever someone gets to that product. The cfwindow is created by a script in a cfdiv, so they're created on the fly as needed. However, if someone returns to a previously viewed product they get the now-familiar pop-up error telling me the window already exists. I agree ... CF should just say "oh well" and ignore the create statement if the window already exists, but whatever.

I am now creating a local variable with the productID whenever a window is created, and then check for the existence of that variable before creating the window.

Somehow I'm still getting the error, and am wondering if CF is seeing the create command inside the cfif, and ignoring the cfif. Sort of like a syntax checker checks the code before actually running it. Doesn't make sense to me.

Comment 34 by Mik Muller posted on 7/8/2010 at 12:35 AM

CFTRY doesn't help either.

Comment 35 by Raymond Camden posted on 7/8/2010 at 12:36 AM

Care to share the code? (use pastebin of course)

Comment 36 by Mik Muller posted on 7/8/2010 at 12:42 AM

D'oh! Of course. The variable I was writing to was local to the inside of that CFDIV. I thought it would become available to the rest of the page, but apparently that's not how CFDIV works. Learning all the time!

So now I'm writing it to a session variable and all's well in the world.

<cfparam name="session.modal" default="">
<cfif not listFind(session.modal,url.productID)>
<cfset session.modal = listAppend(session.modal,url.productID)>
<cfwindow ... >
</cfif>

Interesting, though, that a CFTRY still didn't stop the error.

Comment 37 by Raymond Camden posted on 7/8/2010 at 12:46 AM

I'd have to see the code to see why cftry didn't work.

Comment 38 by Mik Muller posted on 7/13/2010 at 7:33 PM

Ok. As it turns out, I can't leave all those extra cfwindows laying around because the customer may have logged in in between opening and closing certain windows, and there's work to do in the windows if you're not logged in -- and simply re-opening an existing window that doesn't know you've since logged in, well, creates confusion.

So now I want to destroy a window when it closes, in case the customer has logged in between opening and closing various product cfwindows.

This means I need to create them on the fly, using your javascript example, which I simply cannot get to work. Driving me nuts.

Here's some code, which is inside a CFDIV:

<cfajaximport tags="cfwindow">

<cflayout name="rightAccordionLayout" type="tab" tabstrip="False">
<cflayoutarea title="Product Quantities" selected="#iif(url.tab eq 2, DE("True"), DE("False"))#">
<script>
function cleanup() {
ColdFusion.Window.destroy('priceMatrixModal',true);
}

function showWin(id) {
//do we have one?
try {
ColdFusion.Window.destroy('priceMatrixModal',true);
} catch(e) { }
ColdFusion.Window.create('priceMatrixModal','Product Price Grid', 'price_matrix.cfm?productID='+id,{center:true,modal:true,closable:true,width:600,height:600});
ColdFusion.Window.onHide('priceMatrixModal',cleanup);
}
</script>
<div id="productQuantitiesTab">
<div class="subtotals">
Your totals:
</div>
<cfoutput>
<button onclick="javascript:showWin('#url.productID#');">Calculate Prices</button>
</cfoutput>
</div>
</cflayoutarea>
</cflayout>

Comment 39 by Mik Muller posted on 7/13/2010 at 8:11 PM

Nevermind. I changed my approach. I keep forgetting that this is javascript, which doesn't run in the same order as the cf code.

<cfparam name="session.modal" default="">
<cfoutput>
<cfif listFind(session.modal,url.productID)>
<script>
ColdFusion.Window.destroy('priceMatrixModal',true);
ColdFusion.Window.create('priceMatrixModal','Product Price Grid', 'price_matrix.cfm?productID=#url.productID#',{center:true,modal:true,closable:true,width:600,height:600,initshow:false});
</script>
<cfelse>
<cfset session.modal = listAppend(session.modal,url.productID)>
<script>
ColdFusion.Window.create('priceMatrixModal','Product Price Grid', 'price_matrix.cfm?productID=#url.productID#',{center:true,modal:true,closable:true,width:600,height:600,initshow:false});
</script>
</cfif>
</cfoutput>

Comment 40 by David posted on 8/12/2010 at 1:31 AM

Used your code here on cfwindow. Worked great on 8 and now that I have switched to 9 I am having a little trouble. The modal is set to true but you can still control the back screen. To top that the cfwindow is also grayed out.

Comment 41 by Raymond Camden posted on 8/12/2010 at 1:34 AM

Is this online where we can see?

Comment 42 by Mik Muller posted on 8/31/2010 at 9:14 PM

I've changed my tact yet again, opting to create and destroy every window on a per-use basis. Don't make them closable. Have a destroy on the cancel <button> outside the cfform.

Also no longer trying to keep track of which modal windows have been created. That got very sloppy.

Another trick could be to have only one window and keep re-using it over and over, pushing whatever content you want into it. Just make sure you clean out the window before hiding it, because I had a hell of a time getting my content into it while it was hidden... and having the window pop up with old content in it is confusing for the end-user.

One last thing, creating a window via javascript for some reason does not correctly center the window. I found this trick:

<script>
ColdFusion.Window.getWindowObject('yourWindowName').center();
</script>

Put that as the first line and it'll recenter once it is open.

Lastly, the "try" wasn't working because I put it outside the <script> block. Obviously <CFTRY> isn't going to catch a javascript error. I needed to do this instead:

try { } catch(e) { }

Ok. All buttoned up.

Comment 43 by mike appenzellar posted on 11/19/2010 at 1:53 AM

This works great in Firefox but in IE 7 (govt) I am getting a javascript error within the ajax.js file. It's having an issue with the windows already being in existance, but if I take out the cleanup it says the window already exists...any thoughts? Also, if I browse the page by itself works fine, but from within a cfwindow that navigates to this page, that's when the error occurs.

Comment 44 by mike appenzellar posted on 11/19/2010 at 1:55 AM

Forgot to mention, first time I click the link (which is a navigate) the page is fine, but I don't get the error until the 2nd time it gets clicked.

Comment 45 by Raymond Camden posted on 11/19/2010 at 1:56 AM

This entry is over two years old. Adobe added nicer ways to handle window cleanup post CF8. I don't have the reference right in front of me - but check the most recent docs for 901.

Comment 46 by jp posted on 2/22/2011 at 11:21 PM

hey ray - thanks for all the info over the years...
I know this is an old post - I've looked thru 901 docs and can't find answer... the code you provided isn't working for me... and I was curious if you had a thought...

cfdebug says the it cant find the window ...
--- debug info ---
window:global: uncaught exception: ColdFusion.Window.onHide: Window not found, id: WIN_Report (, line 0)

error:http: ColdFusion.Window.onHide: Window not found, id: WIN_Report

info:widget: Window shown, id: WIN_Report
--- end debug info ---

here's my code...
// DEFAULT REPORT CONFIG
var DEFAULTREPORTconfig = {
height:350,width:1120,center:true,refreshOnShow:true,modal:false,closable:true,draggable:true,initshow:false,resizable:false
}

function destroyWIN(x) {
ColdFusion.Window.destroy(x,true)
}

// CREATE AND SHOW DEFAULT REPORT WINDOW
function popupReport(RPT) {
var thisRPT = RPT;
var thisWindowName = 'WIN_Report';
//does the window already exist?
try {
ColdFusion.Window.destroy(thisWindowName,true);
} catch(e) { }
//create & show
ColdFusion.Window.create(thisWindowName, 'My Report', 'reports/'+thisRPT+'.cfm', DEFAULTREPORTconfig);
ColdFusion.Window.show(thisWindowName);
// what to do when we hide it
ColdFusion.Window.onHide(thisWindowName,destroyWIN(thisWindowName));

}

Comment 47 by jp posted on 2/22/2011 at 11:59 PM

Think I found the answer - the onHide event handler - cannot be INSIDE the function that calls the create win... I assume the window doesnt exist until the function has completed...

- http://forums.adobe.com/mes... -

thx for some of the impetus of me 'finding' the answer...

I'm still getting an error (see in my Adobe post) but it's not affecting the execution of the page...

Comment 48 by John Jarrard posted on 7/6/2011 at 5:00 AM

Hey Ray,

Do you mind giving me an example of window.destroy() function that works in CF9? I've been working on this problem for a while, and I can't seem to get it...

Thanks,
JJ

Comment 49 by Raymond Camden posted on 7/6/2011 at 3:26 PM

Does the example above not work?

Comment 50 by Misty posted on 9/5/2011 at 9:38 PM

Hi Ray! I do not know what happened to my code it was working before but broke now!

i am on cf9 and also using cf8, so this code is working on neither! can you guide!

function showGroup(recordAction) {
var day = new Date();
var ListWindowID = 'myformName' + day.getTime();
var windowOptions = new Object();
windowOptions.width = 900;
windowOptions.height = 500;
windowOptions.center = true;
windowOptions.modal = true;
windowOptions.refreshOnShow = true;
windowOptions.resizeable = true;
windowOptions.initshow = true;
windowOptions.draggable = true;
windowOptions.closeable = false;
if (recordAction == 'Add') {
ColdFusion.Window.create(ListWindowID,'My Title','edit.cfm?formName=' + ListWindowID + '&run=' + recordAction, windowOptions);
}
function closeEditWindow() {
ColdFusion.Window.hide(ListGroupWindowID);
ColdFusion.Grid.refresh('grid01', true);
}
}

this function closeEditWindow() is called from within cfwindow, a button is inside the cfwindow, i click it and it should close the cfwindow and refresh the grid, hide means destroy, [wanna say] that it should not persist previous value in any case!

can u guide

Comment 51 by Raymond Camden posted on 9/6/2011 at 5:46 AM

So what is exactly wrong though? Your last sentence in the comment doesn't exactly make sense to me.

Comment 52 by Misty posted on 9/6/2011 at 9:54 AM

The Last Comment Means

1. When i click the Close button from cfwindow, it should actually close the cfwindow and refresh the div, which it is not doing!
2. I get the Following error when i click on the close button inside cfwindow:

ListWindowID is not defined
[Break On This Error] ColdFusion.Window.hide(ListWindowID);

A Type Mistake in the above Comment before yours read it like this

function closeEditWindow() {
ColdFusion.Window.hide(ListWindowID);
ColdFusion.Grid.refresh('grid01', true);
}
}

Comment 53 by Raymond Camden posted on 9/6/2011 at 2:51 PM

You defined listWindowID in the other function so it is local only to that function. Try setting it as a page level variable. Outside your method just set it to an empty string, and in showGroup(), set it there (without the var in front).

Comment 54 by Misty posted on 9/7/2011 at 12:43 PM

Thanks Ray,

It worked

yepee

Comment 55 by Vincent Moulin posted on 7/5/2013 at 2:06 PM

Hi Ray,

I'm trying to do a similar thing : I have a page displaying product's thumbs. On this one, I want, when a user click the picture or the more details button, that a cfwindows open. This last will show a bigger picture and more details.

I have used the code you show us in this post but I have a strange trouble :
- when I first click on a picture, the popup show up correctly;
- then when I close it and click on a second one, the popup show less than 1 second (and seems well refreshed) but then a redirection occurs (to the same url as the main previous page but with only a part of my footer displayed.

Very strange. It happens on Firefox, Chrome, Opera and Safari. I have not tested on IE.

Here is the code I use : http://pastebin.com/v29aKDpA

You can view this bug live on http://ver3.joe-cool.co.uk/... for instance

Do u have an idea what I'm doing wrong ?
Thanks.

Comment 56 by Raymond Camden posted on 7/5/2013 at 5:23 PM

Best I can suggest is using the JS console to see if anything shows up there.

Unfortunately, I no longer "support" these UI features in CF. They simply cause too many problems. I *strongly* urge my readers to skip them and use one of the many other options out there. For example, jQuery UI Dialog widgets.

That doesn't help you, I realize, but it is my honest recommendation.