In a previous entry I demonstrated how you can use the underlying Ext framework to enhance your CFWindow. And then Matt left a comment asking if it was possible to dynamically resize the CFWindow. The answer is yes and it's quite easy actually. The CFWindow utilizes the Ext.BasicDialog object which has a function called setContentSize, which resizes the dialog to fit the specified content size.

[More]

A couple weeks ago I wrote a post on Enhancing CFWindow with JavaScript, and it was recently asked if there was a way to identify all the windows and their visible status that currently exist on a page where you are using the ColdFusion.Window.create function to create new CFWindow instances. It took a few minutes of digging with FireBug, but I found that there is a ColdFusion.objectCache object that holds information about the various ext object that get created with the ColdFusion AJAX features. I created a function that loops through the objectCache and finds objects that have a "cfwindowname" property. Then used the Ext.BasicDialog.isVisible() function to determine if the window is currently visible.

[More]

The Ext.QuickTips functionality provides attractive and customizable tooltips for any element. Adobe didn't add any QuickTips functionality to ColdFusion 8, but the JavaScript files to support it are included with the other Ext related files in the "CFIDE/scripts" directory, so I am going to show you a couple simple ways you can utilize them to enhance your tooltips.

[More]

ColdFusion 8 added the CFWindow tag which creates a pop-up window in the browser, which is not really a pop-up window, but rather it is a div layer that looks like a window and can be hidden and shown via JavaScript. Today, I am going to demonstrate a couple ways you can expand your use of the CFWindow tag by incorporating some JavaScript that interacts with the underlying Ext.BasicDialog object.

[More]

A couple weeks ago I posted an entry on how to save the state of selected CFLayout generated tabs on a page. Then it was asked how that example could be expanded to save the state of multiple tab layouts on a page. I have created an example of how to do that below.

[More]

I have blogged a lot about the new AJAX related functionality that comes with CF8, and some of my examples have demonstrated how to utilize the underlying EXT and YUI JavaScript libraries that power these great features. There are 5 functions that ColdFusion provides that give you access to the JavaScript objects, and if you are proficient at JavaScript, I highly recommend you spend some time researching each of the libraries so you can be familiar with how you can customize them to your needs.

If your not familiar with JavaScript, get familiar. More and more attention is being focused on making websites more engaging for users, and knowing how to use javascript to implement AJAX related features is a powerful tool to have at your disposal.

[More]

Yesterday I blogged about how to create a custom date renderer for CFGrid. Today I am going to add to that example how to validate the data entered into the CFGrid before it is sent to the cfc to update the database. The CFGrid (Ext.grid.EditorGrid) object has an event called "validateedit", which fires after a cell is edited, but before the value is set in the record. We will be adding a listener to that event that will validate the data that is being submitted and, if the data is not valid, display an alert message and cancel the changes.

[More]

One of the coolest things about the ColdFusion 8 implementation of the CFGrid tag is that you can do a lot of customization, if you know your way around the Ext objects. I have found several blog entries about using custom renderers with the CFGrid tag. However, could not find a working example of one for date fields, so I decided to build one.

[More]

So I was using the cflayout tag to create a tab navigation system for reporting module. Each tab had a different report based on live data. The problem is that if you are on any tab that is not the default tab and you click refresh or press the F5 key to reload the data, then you get sent back to the default tab.

I needed to find a way to make it so that whenever a user clicked on a tab, their selected tab was saved in the session scope so that if they happen to use their browsers refresh links instead of using the refresh links I provided for them, they didn't loose which tab they were on.

[More]

So I was reading through the list of ColdFusion 8 AJAX JavaScript Functions, and I noticed that Adobe actually built in the JavaScript Version of CFDump that I blogged about recently.

If you enable the ajax debugging and browse to your page with "cfdebug" as a url parameter, then you can use the ColdFusion.Log.dump() function to dump the object you are working with into the cfdebug log window. Of course, it still has the same problem with recursion on large objects

[More]