How do I change the color of a cfgrid row when the date field is older than 90 days?

A couple of things. First, I probably should have stated that I am very green when it comes to programming so much of what you gave me is greek and I'm not really sure where to start with modifying it. Secondly, I see a closing </cfif> but no opening <cfif>. Am I missing something?

The closing /cfif needs to be ignored. I only include the EXT code on certain conditions and left out the opening cfif.

I understand being "green". No problem.  If you will just plop the code into your code and make the changes you understand, I will try to help you through the errors.  Do you use Firefox?  If you do, you need to add the Firebug plug-in. It's a great debugging tool.

Yes I have firebug installed but I don't really know how to use it to debug.

Here is what I have done:

1. Dropped the code in the head
2. Changed the grid name to the grid name I am using (I use two grids with the same name. One or the other is shown based on the user's access level. I don't think this will be an issue since I want the custom render to work on both.)

Questions:
1. The first column in my grid is not displayed. It still has a row number correct? (I believe the cfgrid index starts at "0")
2. What data source do I use in mygrid.getDataSource()?

All columns have a column number whether displayed or not. The mygrid.getdatasource is a quasi grid refresh. Nothing need to be changed there.

OK. Code is in place and it is not throwing any errors but I'm not seeing any changes in the grid either.

Show me the code you added and the code for one of your grids.

<cfajaximport tags="cfform, cfdiv, cfgrid">
<!--- Special rendering for company name colors --->
<script type="text/javascript" language="javascript">
// custom renderer for Color column
function renderName(data,cellmd,record,row,col,store) {
 if (record.data.STRUCTURE_COLOR_CODE &&  record.data.STRUCTURE_COLOR_CODE != 'undefined') return '<b style="color:#' + record.data.STRUCTURE_COLOR_CODE.replace(new RegExp("^[\\s]+", "g"), "") + ';">' + data + '<b>';
 else return data;
 }
// function to invoke custom renderers and return re-configured grid (called from ajaxonload()
function CompRendGrid() {
  mygrid = ColdFusion.Grid.getGridObject('clients');
  cm = mygrid.getColumnModel();
  cm.setRenderer(7,renderName); // assign custom renderer for Name column in the grid
  mygrid.reconfigure(mygrid.getDataSource(),cm); // reconfigure grid
}
</script>            
<!--- fire the custom grid renderers on pageload --->
<cfset ajaxOnLoad("CompRendGrid")>



<--- GRID ---->
  <cfif ListContains("user", Session.MM_UserAuthorization)>
    <cfform name="Clients" >
      <cfgrid name="clients"
         format="html"
         striperows="yes"
         colheaderbold="yes"
         colheaderfontsize="12"
         pagesize="15"
         selectmode="row"
         bind="cfc:CFC.clients.getData({cfgridpage},{cfgridpagesize},{cfgridsortcolumn},{cfgridsortdirection})">
        <cfgridcolumn name="client_ID" display="no"/>
        <cfgridcolumn name="client_name" width="275" header="Client"/>
        <cfgridcolumn name="alliance" width="60" header="Alliance"/>
        <cfgridcolumn name="owner" width="60" header="Owner"/>
        <cfgridcolumn name="FET_prospect" width="90" header="FET Prospect"/>
        <cfgridcolumn name="date_added" width="140" header="Date Added"/>
        <cfgridcolumn name="status" width="90" header="Status" values="Remove,NA,Interested,Contract Pending,Contract Signed"/>
        <cfgridcolumn name="last_modified" width="140" header="Last Modified"/>
      </cfgrid>
        <cfinput type="button" name="Download" value="Download" onClick="doDownload()">    
    </cfform>
  </cfif>

if (record.data.STRUCTURE_COLOR_CODE &&  record.data.STRUCTURE_COLOR_CODE != 'undefined') return '<b style="color:#' + record.data.STRUCTURE_COLOR_CODE.replace(new RegExp("^[\\s]+", "g"), "") + ';">' + data + '<b>';
 else return data;

You need to change the above script to check for your date field. A good test would be to not use an IF and just use;

 return '<b style="color:blue;"> + data + '</b>';

That should change the text color of column 7 (date modified) to blue on all rows.
 

return '<b style="color:blue;">' + data + '</b>';

I missed an apostrophe.

I don't know what format your "last modified" date is in, but you may have to dig up some javascript date handling to get the results you want.

Ok. Got something to happen this time. All the text in the column is now blue even the hidden "null" values ;)

Ideally I'd like to change the background of the entire row if possible or just the color of those cells that validate to the date logic I need to put in place.

Would this be of any help in making that happen?

Here's how I change the color of a cfgrid row depending on the row's query variables.

1. Select a styles column into your query in your cfc. We'll querysetcell that column later when we know what it should be. I tried using row_number() in the select statement query to match to the cell numbers, but it wasn't working out.

<cfquery name="thisquery" datasource="#dsn#">
SELECT *, '' as styles FROM table
</cfquery>

2. You have to set the background color for cells individually, can't do whole specific rows, unfortunately, given the identifiers we have to work with. Since my grids never have more than 10 columns, I set the background colors for 10 cells for each row needing a bg color (to keep it standard across my grids.

For example, to change the first cell in the first row, set the class .x-grid-cell-0-1 to your bg color. For row 9, cell 4, the class is .x-grid-cell-8-4. Keep in mind that the row number is not simply currentrow-1 of the query. It is the row number of the current page of the grid (0 to #pagesize#, NOT 0 to #recordcount# unless you don't use paging). So, after I have my query, I then run this little blurb to set the styles, for the cells of each row. You can tailor it to be specific to rows that need color, of course:

<cfset this_row = 0>
<cfset this_limit = pagesize - 1>
<cfoutput query="thisquery">
   <cfset this_color = "dddddd">
   <cfif somequerycolumn IS "somevalue"><cfset this_color = "ffcc00"></cfif>
   <cfset temp = #QuerySetCell(thisquery, "styles", "<STYLE TYPE=""text/css"">.x-grid-cell-#this_row#-1,.x-grid-cell-#this_row#-2,.x-grid-cell-#this_row#-3,.x-grid-cell-#this_row#-4,.x-grid-cell-#this_row#-5,.x-grid-cell-#this_row#-6,.x-grid-cell-#this_row#-7,.x-grid-cell-#this_row#-8,.x-grid-cell-#this_row#-9,.x-grid-cell-#this_row#-10 {background:###this_color#;}</STYLE>", currentrow)#>
   <cfif this_row LT this_limit><cfset this_row = this_row + 1><cfelse><cfset this_row = 0></cfif>
</cfoutput>

3. In the cfgrid, I have a column for styles that is display="no". The styles are written but not displayed, and it seems to work fine after a lot of trial and error.

Oh - "date modified" is in datetime format. I'd like to mask the time portion but apparently that is only;y available for Flash cfgrids.

You could always try using ;

textColor = "(CX EQ Pam ? blue : black)">

on your cfgridcolumns.

 In your query you might want to evaluate the date against todays date and return a 1 or 0 or a number that represents the days difference.

something like;  select (datediff(now - last_modified) as datecheck

Then on your cfgridcolumn; bgcolor = "(c11 lt 30 ? blue : white)"
assuming the new cfgridcolumn for datecheck is column 11.

Hope I'm not confusing the issue.

Yeah. I'm a bit confused. I've spent too much time on the front end of applications and websites and not much time trolling around on the back end.

1. So, the proposal to use textColor = "(CX EQ Pam ? blue : black)">  will do what?

2. I should use select (datediff(now - last_modified) in my cfgrid query? I'm not sure how to implement that.

3. I'm not exactly sure what bgcolor = "(c11 lt 30 ? blue : white)" does. Is that basically saying to color the background of column 11 blue or white? I'm not clear what It 30 is.

!. textcolor and bgcolor are paramaters of the cfgricolumn tag. You can use it to color the text or background of a grid cell. You can use the same expression on all grid columns if you wish to color the row. But you need some test like I usedd in the example. You can use your grid bind query to create a column for the grid (datecheck) and use that column to set the color of all the other columns.

2. You can add the SQL statement to create the datecheck column for use in the cfgrid. Maybe you should post your SQL code.

These are the 2 options that I can think of to change the color of gridf columns;
         A. Use the EXT code and change the javascript to test the date column to determine if you want to change the column color.
         B. Use the textcolor or bgcolor paramaters of the cfgridcolumn tag to change the colors.

You are probably ready to give up on me at this point and I appreciate your dedication but I am still not getting how to put this all together. I get the logic behind what needs to happen but actually coding the test portion and pulling it all together in a nice neat package is beyond me.

Here is the SQL code for one of the queries. The query for the second cfgrid is nearly identical with the exception that it limits the results based on the user's credentials.

   <cffunction name="getClientsAdmin" access="remote" returntype="struct">
      <cfargument name="page" type="numeric" required="yes">
      <cfargument name="pageSize" type="numeric" required="yes">
      <cfargument name="gridsortcolumn" type="string" required="no" default="">
      <cfargument name="gridsortdir" type="string" required="no" default="">
 
      <!--- Get data for Admin grid --->
      <cfquery name="clients" datasource="#THIS.dsn#">
      SELECT *
      FROM Clients
      <cfif gridsortcolumn NEQ ""
         and gridsortdir NEQ "">
         ORDER BY #gridsortcolumn# #gridsortdir#
      </cfif>
      </cfquery>
 
 
    <cfreturn queryconvertforgrid(clients,page,pagesize)/>
   </cffunction>
                                              

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:

<cfquery name="clients" datasource="#THIS.dsn#">
      SELECT *,(datediff(now - last_modified) as datecheck<----------- add this code
      FROM Clients
      <cfif gridsortcolumn NEQ ""
         and gridsortdir NEQ "">
         ORDER BY #gridsortcolumn# #gridsortdir#
      </cfif>
      </cfquery>

Add this grid column;
<cfgridcolumn name="DateCheck" display="no"/>

Change this grid column;
<cfgridcolumn name="last_modified" width="140" header="Last Modified" bgcolor = "(c11 lt 30 ? blue : white)"/>

Actually make the datechecck column display="yes" so you can see the data (temporary).

Adding ,(datediff(now - last_modified) as datecheck causes the app to throw an error.

What's the error?  Post the SQL code

I get a dialogue box on loading that says:

 Error invoking CFC /CFC/clients.cfc : Internal Server Error [Enable debugging by adding 'cfdebug' to your URL parameters to see more information]


Firebug is showing the getClient method in the CFC failing.

Can you look at the application log on your CF server? It would have details of the error.

I believe I got the following code wrong;

  SELECT *,(datediff(now - last_modified) as datecheck<----------- add this code

It should be;

  SELECT *,(datediff("d", last_modified,#now()#) as datecheck<----------- add this code

I just verified this in my code.

I don't have access to that but I can ask for it. I'd try an test this locally but I'd have to spend some time setting up the DB and CF but that will probably take longer.

make the change I suggested and that will probably fix the error

Well, it's still throwing an error.

Aha!

The parentheses in front of datediff is the culprit. I'm now getting values in my grid of either 0 or 30. Now I need to get the last_modified column to check that value and color the row based on whether that value is 30 or greater right?

Right. You can do that with either the EXT code or the bgcolor parameter of the cfgridcolumn tag.

Maybe it's just a lack of sleep but I can't get this to work. Here is the code that I am currently using(not including the query in the cfc) and a screengrab of the current results.

<!--- Customer Render code in the head --->
 
<cfajaximport tags="cfform, cfdiv, cfgrid">
<!--- Rendering for date modified in excess of 90 days --->
<script type="text/javascript" language="javascript">
// custom renderer for Color column
function renderName(data,cellmd,record,row,col,store) {
 return '<b style="color:blue;">' + data + '</b>';
 }
// function to invoke custom renderers and return re-configured grid (called from ajaxonload()
function CompRendGrid() {
  mygrid = ColdFusion.Grid.getGridObject('clients');
  cm = mygrid.getColumnModel();
  cm.setRenderer(7,renderName); // assign custom renderer for Name column in the grid
  mygrid.reconfigure(mygrid.getDataSource(),cm); // reconfigure grid
}
</script>            
<!--- fire the custom grid renderers on pageload --->
<cfset ajaxOnLoad("CompRendGrid")>
 
 
<!--- Customer Render code in the grid --->
 
        <cfgridcolumn name="last_modified" width="140" header="Last Modified" bgcolor = "(c11 lt 90 ? blue : white)"/>
 	<cfgridcolumn name="DateCheck" display="yes"/></cfgrid>
                                              

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:

You're trying to use both methods. Comment out lines 1 through 19.  Now you're checking for less than 90 days and the bgcolor should be blue. Let's see what it does now.

I took out the method and not I am not getting any changes to the grid.

Use this;

// custom renderer for Color column
function renderName(data,cellmd,record,row,col,store) {
 if (record.data.DATECHECK < 90 return '<b style="background-color:ffff80>' + data + '<b>';
 else return data;
 }

// function to invoke custom renderers and return re-configured grid (called from ajaxonload()
function CompRendGrid() {
  mygrid = ColdFusion.Grid.getGridObject('clients');
  cm = mygrid.getColumnModel();
  cm.setRenderer(1,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(2,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(3,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(4,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(5,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(6,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(7,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(8,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(9,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(10,renderName); // assign custom renderer for Name column in the grid
  mygrid.reconfigure(mygrid.getDataSource(),cm); // reconfigure grid
}

Sorry, only render columns 2 through 9.  I just realized that the datecheck column is number 10.

I gave it a try and the app fails silently. Firebug did pick up an error. Here is the syntax of that error
missing ) after condition
? in cfajax.js@99()cfajax.js (line 103)
? in cfajax.js@118("/CFC/clients.cfc", "GET", "method=getClientsAdmin&returnFormat=json&argumentCollection=%7B%22page%22%3A1%2C%22pageSize%22%3A15%2C%22gridsortcolumn%22%3A%22DATECHECK%22%2C%22gridsortdir%22%3A%22ASC%22%7D", true, function(), null, true)cfajax.js (line 119)
? in cfajax.js@454(Object async=true cfcPath=/CFC/clients.cfc httpMethod=GET, "getClientsAdmin", Object page=1 pageSize=15 gridsortcolumn=DATECHECK, Object bindToAttr=true bindToParams=Object)cfajax.js (line 488)
? in cfajax.js@1562(null, Object bindToAttr=true cfc=/CFC/clients.cfc)cfajax.js (line 1584)
? in my_page.cfm@103(Object events=Object _cf_actions=Object _cf_firstLoad=true, 1, 15, "DATECHECK", "ASC", null, function(), Object data=Object baseParams=Object paramNames=Object, Object params=Object, Object)my_page.cfm (line 105)
? in cfgrid.js@481(Object start=0 limit=15 sort=DATECHECK dir=ASC, Object, function(), Object data=Object baseParams=Object paramNames=Object, Object params=Object)cfgrid.js (line 498)
? in data.js@11(Object params=Object)data.js (line 11)
? in data.js@11("DATECHECK", "ASC")data.js (line 11)
? in grid.js@11(Object container=Object id=cfgrid1244802916990, 8)grid.js (line 11)
? in ext-core.js@12()ext-core.js (line 12)
? in ext-core.js@12()ext-core.js (line 12)
? in grid.js@9("click", Object browserEvent=Event unload button=-1 type=unload)grid.js (line 9)
? in grid.js@9(Object browserEvent=Event unload button=-1 type=unload)grid.js (line 9)
? in ext-core.js@13()ext-core.js (line 13)
? in yahoo-dom-event.js@135()yahoo-do...-event.js (line 135)
[Break on this error] if (record.data.DATECHECK < 90 return '...ckground-color:ffff80>' + data + '<b>';\n


I've even added a parenthese at the end of the if statement but it still throws the same error

I just added the parenth before the return statement and the error is now gone however I am not seeing any changes to the grid. I also added a closing quote on the the style. That didn't produce any results either.

Yeah, there was a missing paren after 90 and the semicolon and quote after the color code;

 if (record.data.DATECHECK < 90) return '<b style="background-color:#ffff80;">' + data + '<b>';
 else return data;
 }

You should also add the # sign in front of the color code.

Still nothing. No errors but no coloring either.

Is this a public page that I might look at?

Unfortunately it is behind registration.

Yes. Here is what the cfgrid looks like now.

    <cfform name="Clients" >
      <cfgrid name="clients"
         format="html"
         striperows="yes"
         colheaderbold="yes"
         colheaderfontsize="12"
         pagesize="15"
         selectmode="edit"
         delete="yes"
         bind="cfc:CFC.clients.getClientsAdmin({cfgridpage},{cfgridpagesize},{cfgridsortcolumn},{cfgridsortdirection})"
         onchange="cfc:CFC.clients.editClient({cfgridaction},{cfgridrow},{cfgridchanged})">
        <cfgridcolumn name="client_ID" display="no" />
        <cfgridcolumn name="client_name" width="275" header="Client"/>
        <cfgridcolumn name="alliance" width="60" header="Alliance"/>
        <cfgridcolumn name="owner" width="60" header="Owner"/>
        <cfgridcolumn name="FET_prospect" width="90" header="FET Prospect"/>
        <cfgridcolumn name="date_added" width="140" header="Date Added"/>
        <cfgridcolumn name="status" width="90" header="Status"/>
        <cfgridcolumn name="last_modified" width="140" header="Last Modified" />
 		<cfgridcolumn name="DateCheck" display="yes"/></cfgrid>
        <cfinput type="button" name="Download" value="Download" onClick="doDownload()">     
   </cfform>
                                              

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:

This is what I'm using and it turns the background of all cells to yellow;

<!--- Special rendering for company name colors --->
<script type="text/javascript" language="javascript">
// custom renderer for Color column
function renderName2(data,cellmd,record,row,col,store) {
 if (record.data.DATECHECK < 10) return '<b style="background-color:#ffff80;">' + data + '<b>';
 else return data;
 }

// function to invoke custom renderers and return re-configured grid (called from ajaxonload()
function CompRendGrid2() {
  mygrid = ColdFusion.Grid.getGridObject('grid_Companiesviewed');
  cm = mygrid.getColumnModel();
  cm.setRenderer(1,renderName2); // assign custom renderer for Name column in the grid
 cm.setRenderer(2,renderName2); // assign custom renderer for Name column in the grid
 cm.setRenderer(3,renderName2); // assign custom renderer for Name column in the grid
 cm.setRenderer(4,renderName2); // assign custom renderer for Name column in the grid
 cm.setRenderer(5,renderName2); // assign custom renderer for Name column in the grid
  mygrid.reconfigure(mygrid.getDataSource(),cm); // reconfigure grid
}
</script>            
<!--- fire the custom grid renderers on pageload --->
<cfset ajaxOnLoad("CompRendGrid2")>

You might try removing the striperows parameter from the cfgrid tag.

Removed. No luck. You're really working for these 500 pts huh? I really appreciate your persistence.

Change the following line;

 if (record.data.DATECHECK < 90) return '<b style="background-color:#ffff80;">' + data + '<b>';
 else return data;

To;

 return '<b style="background-color:#ffff80;">' + data + '<b>';

Let's see what happens.

I hate to say this but nothing happens. No errors. No colors. Just data.

Post your code, please.

Here is the script and the grid

<script type="text/javascript">
 
<!---custom renderer for Color column--->
function renderName(data,cellmd,record,row,col,store) {
 return '<b style="background-color:#ffff80;">' + data + '<b>';
 }
 
 
<!---function to invoke custom renderers and return re-configured grid called from ajaxonload--->
function CompRendGrid() {
  mygrid = ColdFusion.Grid.getGridObject('clients');
  cm = mygrid.getColumnModel();
  cm.setRenderer(2,renderName); // assign custom renderer for Name column in the grid
  cm.setRenderer(3,renderName); // assign custom renderer for Name column in the grid
  cm.setRenderer(4,renderName); // assign custom renderer for Name column in the grid
  cm.setRenderer(5,renderName); // assign custom renderer for Name column in the grid
  cm.setRenderer(6,renderName); // assign custom renderer for Name column in the grid
  mygrid.reconfigure(mygrid.getDataSource(),cm); // reconfigure grid
}
</script>
 
 
 
    <cfform name="ClientsAdmin" >
      <cfgrid name="clients"
         format="html"
         colheaderbold="yes"
         colheaderfontsize="12"
         pagesize="15"
         selectmode="edit"
         delete="yes"
         bind="cfc:CFC.clients.getClientsAdmin({cfgridpage},{cfgridpagesize},{cfgridsortcolumn},{cfgridsortdirection})"
         onchange="cfc:CFC.clients.editClient({cfgridaction},{cfgridrow},{cfgridchanged})">
        <cfgridcolumn name="client_ID" display="no" />
        <cfgridcolumn name="client_name" width="275" header="Client"/>
        <cfgridcolumn name="alliance" width="60" header="Alliance"/>
        <cfgridcolumn name="owner" width="60" header="Owner"/>
        <cfgridcolumn name="FET_prospect" width="90" header="FET Prospect"/>
        <cfgridcolumn name="date_added" width="140" header="Date Added"/>
        <cfgridcolumn name="status" width="90" header="Status" />
        <cfgridcolumn name="last_modified" width="140" header="Last Modified"/>
 		<cfgridcolumn name="DateCheck" display="yes"/></cfgrid>
        <cfinput type="button" name="Download" value="Download" onClick="doDownload()">     
   </cfform>
                                              

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:

and the query

   <cffunction name="getClientsAdmin" access="remote" returntype="struct">
      <cfargument name="page" type="numeric" required="yes">
      <cfargument name="pageSize" type="numeric" required="yes">
      <cfargument name="gridsortcolumn" type="string" required="no" default="">
      <cfargument name="gridsortdir" type="string" required="no" default="">
 
      <!--- Get data for Admin grid --->
      <cfquery name="clients" datasource="#THIS.dsn#">
      SELECT *,(datediff("d", last_modified,#now()#) as datecheck
      FROM Clients
      <cfif gridsortcolumn NEQ ""
         and gridsortdir NEQ "">
         ORDER BY client_name ASC #gridsortcolumn# #gridsortdir#
      </cfif>
      </cfquery>
 
      <!--- And return it as a grid structure --->
    <cfreturn queryconvertforgrid(clients,page,pagesize)/>
   </cffunction> 
                                              

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:

You're missing some code.
<cfajaximport tags="cfform, cfdiv, cfgrid">

 <!--- fire the custom grid renderers on pageload --->
<cfset ajaxOnLoad("CompRendGrid2")>

I finally got this working. A good night's sleep and a peak at a few other examples and I believe I figured out what was going wrong. Once I moved the <cfset ajaxOnLoad("CompRendGrid2")> to the very bottom of the page just before the closing body tag it worked. That bit of code has to exist after the grid I want the custom renderer applied to. I've also gone ahead and switched the background style back to the text style. I thought that maybe the background color would fill the entire cell and not just the arae around the text but I was wrong. I also added a little extra code to color other values in the grid. I thought it may throw and error because I didn't define a range but what I have still appears to work. Below is my final code.

<!--- import for custom renderer since we are not using cf8 ajax controls. top of page above opening html tag --->
<cfajaximport/>
 
<!--- Custom renderer that colors the text in each row based on certain values in DATECHECK column --->
 
<script type="text/javascript">
renderName = function(data,cellmd,record,row,col,store) {
if (record.data.DATECHECK >= 90) return '<b style="background-color:red;">' + data + '</b>';
  else
if (record.data.DATECHECK >= 60 ) return '<b style="color:orange;">' + data + '</b>';
	else
if (record.data.DATECHECK >= 30 ) return '<b style="color:green;">' + data + '</b>';else return data;
 }
 
// function to invoke custom renderers and return re-configured grid (called from ajaxonload()
CompRendGrid = function() {
  mygrid = ColdFusion.Grid.getGridObject('clients');
  cm = mygrid.getColumnModel();
 cm.setRenderer(1,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(2,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(3,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(4,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(5,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(6,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(7,renderName); // assign custom renderer for Name column in the grid
 cm.setRenderer(8,renderName); // assign custom renderer for Name column in the grid
 mygrid.reconfigure(mygrid.getDataSource(),cm); // reconfigure grid
}
</script>
 
 
<!--- fires our custom grid renderers on pageload. Placed after grids before closing head tag --->
 
<cfset ajaxOnLoad("CompRendGrid")>
                                              

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:

It was a long hall and I appreciate your patience. Thanks. Turns out it was another post here at experts-exchange that included yourself that help me finally get this working.