Whatever message this page gives is out now! Go check it out!

ColdFusion.Grid.refreshBottomToolbar

Last update:
May 18, 2026

Description

Refreshes the bottom toolbar that can be used to add a control, for example icon or button. This function internally calls the JavaScript function ColdFusion.Grid.showBottomToolbar.

Function syntax

ColdFusion.Grid.refresheBottomToolbar(Id)

Parameters

  • Id: Name of the grid control.

Example

grid.cfc
<cfcomponent> 
 <cfscript> 
 remote any function getEmployees(page,pageSize,gridsortcolumn="EMP_ID",gridsortdirection="ASC"){ 
 var startRow = (page-1)*pageSize; 
 var endRow = page*pageSize; 
 
 if(!isdefined("arguments.gridsortcolumn") or isdefined("arguments.gridsortcolumn") and trim(arguments.gridsortcolumn) eq "") 
 gridsortcolumn = "EMP_ID"; 
 if(!isdefined("arguments.gridsortdirection") or isdefined("arguments.gridsortdirection") and arguments.gridsortdirection eq "") 
 gridsortdirection = "ASC"; 
 var mysql = "SELECT Emp_ID, FirstName, EMail, Department FROM Employees"; 
 if(isdefined("arguments.gridsortcolumn") and arguments.gridsortcolumn neq "") 
 mysql = mysql & " ORDER BY " & gridsortcolumn; 
 if(isdefined("arguments.gridsortdirection") and arguments.gridsortdirection neq "") 
 mysql = mysql & " " & gridsortdirection ; 
 rs1 = new query(name="team", datasource="cfdocexamples", sql=mysql).execute(); 
 return QueryConvertForGrid(rs1.getResult(), page, pageSize); 
 } 
 
 
 remote any function editEmployees(gridaction,gridrow,gridchanged){ 
 writelog("edit employee info"); 
 } 
 
 </cfscript> 
 </cfcomponent>
grid.cfm
<script> 
 var refreshToolbar = function(id,type){ 
 type == "top" ? ColdFusion.Grid.refreshTopToolbar(id) : ColdFusion.Grid.refreshBottomToolbar(id); 
 } 
 
 var hideToolbar = function(id,type){ 
 type == "top" ? ColdFusion.Grid.hideTopToolbar(id) : ColdFusion.Grid.hideBottomToolbar(id); 
 } 
 
 var showToolbar = function(id,type){ 
 (type == "top") ? ColdFusion.Grid.showTopToolbar(id) : ColdFusion.Grid.showBottomToolbar(id); 
 } 
 
 var handleToolbar = function(id,type){ 
 if(type == "top"){ 
 tbar = ColdFusion.Grid.getTopToolbar(id); 
 tbar.addButton({ 
 text: "Add User Account", 
 tooltip: "Add a user account", 
 handler: addUserAccount 
 }); 
 } 
 else{ 
 bbar = ColdFusion.Grid.getBottomToolbar(id); 
 bbar.add(new Ext.Toolbar.Separator()); 
 bbar.addButton({ 
 text: "Delete User Account", 
 tooltip: "Delete a user account", 
 handler: deleteUserAccount 
 }); 
 } 
 } 
 
 var GetUserInfo = function(){ 
 alert("Retrieving user account"); 
 } 
 
 var addUserAccount = function(){ 
 alert("Adding new user account") 
 } 
 var deleteUserAccount = function(){ 
 alert("Deleting user account") 
 } 
 </script> 
 <cfform> 
 <br> 
 <cfinput type="button" onClick="showToolbar('empGrid','top')" name="btn1" value="Show Top Toolbar"> 
 <cfinput type="button" onClick="handleToolbar('empGrid','top')" name="btn2" value="Add button to Top Toolbar"> 
 <cfinput type="button" onClick="refreshToolbar('empGrid','top')" name="btn3" value="Refresh Top Toolbar"> 
 <cfinput type="button" onClick="hideToolbar('empGrid','top')" name="btn4" value="Hide Top Toolbar"> 
 <br><br> 
 
 <cfgrid 
 format="html" 
 name="empGrid" 
 width="800" 
 pagesize=5 
 sort=true 
 title="Employee database" 
 collapsible="true" 
 insert="yes" 
 delete="yes" 
 bind="cfc:grid.getEmployees({cfgridpage},{cfgridpagesize},{cfgridsortcolumn},{cfgridsortdirection})" 
 onChange="cfc:grid.editEmployees({cfgridaction},{cfgridrow},{cfgridchanged})" 
 selectMode="edit" 
 > 
 <cfgridcolumn name="Emp_ID" display=false header="ID" /> 
 <cfgridcolumn name="FirstName" display=true header="First Name"/> 
 <cfgridcolumn name="Email" display=true header="Email"/> 
 <cfgridcolumn name="Department" display=true header="Department" /> 
 </cfgrid> 
 
 <br><br> 
 <cfinput type="button" onClick="hideToolbar('empGrid','bottom')" name="btn5" value="Hide Bottom Toolbar"> 
 <cfinput type="button" onClick="showToolbar('empGrid','bottom')" name="btn6" value="Show Bottom Toolbar"> 
 <cfinput type="button" onClick="handleToolbar('empGrid','bottom')" name="btn7" value="Add button to Bottom Toolbar"> 
 <cfinput type="button" onClick="refreshToolbar('empGrid','bottom')" name="btn8" value="Refresh Bottom Toolbar"> 
 </cfform>

Share this page

Was this page helpful?
We're glad. Tell us how this page helped.
We're sorry. Can you tell us what didn't work for you?
Thank you for your feedback. Your response will help improve this page.

On this page