redraw cfgrid with the render method not refresh

Today I was working on using <cfgrid> with a format of html. I really like how it looks and the sorting on the columns of data rocks!

In the application I am working on (still top secret until the end of the month), we have a tabbed display, with each tab being a div and the first div being shown on the screen. My grid was in the second tab/div. The grid was populated with data I knew that from looking in Firebug at the response from my ColdFusion.navigate() method called to create the tabs. The JavaScript has all the data in it if you look. But, my grid was not being displayed, just a bit of a frame around where it was supposed to be.

So I did some digging and found the ColdFusion.Grid.refresh() method. I tried that. No dice. So I did some more digging and looked into the actual cfgrid.js file that <cfgrid> uses. It is under your CFIDE/scripts/ajax/package/ directory. I found that ColdFusion.Grid extends Ext.grid class the of the Ext toolkit. Which <cfgrid> and other controls extend.

In looking up the Ext toolkit documentation I found a method called render(). I was initially looking for a redraw() method, and this one caught my eye. And because the ColdFusion.Grid class extends the Ext.grid class, this method is available to use. I called it just about like this:

<a href="#" onclick="ColdFusion.Grid.getGridObject('MyGrid').render();">Refresh Grid</a>

This method redraws the grid and only the grid, not the entire page or div or frame that it is in. The best part of this is that the <cfgrid> and other controls extend an awesome JavaScript library so not only can we use the methods that Adobe has put on these objects, but the underlying methods as well!

Comments
BlogCFC was created by Raymond Camden. This blog is running version 5.7.002.