Dojo and Coldfusion - A Fix for Using the Dojo TitlePane with CFGrid

We are automatically updating a coldfusion grid with results from a database as users type in a search box. This grid is contained in a dojo dijit.TitlePane. The TitlePane is a collapsible window.

Recently, we discovered an issue in IE. If the Cfgrid has results, then you collapse and open the dojo TitlePane, the grid will disappear. Here is how we fixed it:

Step 1: Set the duration in the TitlePane to 0
Code:div dojoType="dijit.TitlePane" id="resultsDivholder" duration="0"

Step 2: Attach an event to the toggle function using dojo.connect
Code: dojo.connect(dijit.byId('resultsDivholder'),"toggle",gridToggle);
Note: The TitlePane is a dijit. Therefore, you must use dijit.byId and not dojo.byId

Step 3: Refresh the coldfusion grid when the title pane is toggled to open
Code:
function gridToggle() { if(dijit.byId('resultsDivholder').open == true) { ColdFusion.Grid.refresh('ResultsGrid'); } }

Comments (Comment Moderation is enabled. Your comment will not appear until approved.)
Peter Higgins's Gravatar Seems you found a/the solution. The problem is, when the TitlePane is "closed", the containerNode is display:none, so the grid doesn't know how tall it is/will be. Connecting to the end of toggle() means the node now has a height (when .open) ... You don't need to set duration=0, you can just timeout the call to render by the existing titlepane.duration value, but I usually add 25ms or so just to be safe wrt to EDP

Hope this helps, glad you found a solution.
# Posted By Peter Higgins | 7/28/09 2:53 PM
BlogCFC was created by Raymond Camden. This blog is running version 5.9.1.002. Contact Blog Owner