Excell Type Link Colour


I see the link excell type provides a link in the standard default colour of blue.

However I have a slightly different requirement.In my case the data that gets loaded in the link column can be both positive as well as negative values.

In case the value of cell is negative for the link column I would like to show the link value to be showed in red rather than the default blue defined by DHTMLxGrid.

How I do achieve this conditional styling on the link column type.Can you provide me a sample snippet.And I would like to avoid setting the styling in the XML and rather would want to handle it from the grid itself.


You can try to modify the link excell.

Please, locate the following line in the dhtmlxgrid_excell_link.js and replace it with the necessary code:

this.setCValue("<a “+valsAr[1]+” onclick=’(_isIE?event:arguments[0]).cancelBubble = true;’>"+valsAr[0]+"",valsAr);

You can check valsAr[0] value (positive or negative) and add the necesssary style attribute into tag.

The recommendation works like a breeze I am now able to do custom styling on the links.Thanks for the info.I also observed that we have negative appearing in a footer which also has to be custom styled.Similar to the links where do we have to change to make styling in red appear as part of the footer as well??

You can change style of the footer using following css rules:

container of all footers:

div.gridbox div.ftr {


footer element:

div.gridbox div.ftr td {


More information about grid appearance you can find here dhtmlx.com/docs/products/dhtmlxG … t_custstat

The above styling applies to all elements that are part of td’s . Can I apply conditional styling in the CSS based on the content,in my case I want the footer elements to be red only if they are negative or else retain the same styling.

As far as I understood you mean footer counter stat_total and other. Am I right?

In this case you can try to use the onStatReady event handler. It is called each time when footer cell is re-calculated:


value = grid.ftr.rows[1].cells[CELL_INDEX].innerHTML;

grid.ftr.rows[1].cells[CELL_INDEX].innerHTML = new_value;

So, you can get footer value, check it and set the necessary value instead of it.