Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by Vikram on May 06, 2009 06:18
open dhtmlx forum
Excell Type Link Colour

Hi,

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.




Answer posted by Alex (support) on May 06, 2009 07:00

Hello, 

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]+"</a>",valsAr);

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

Answer posted by Vikram on May 07, 2009 21:00
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??
Answer posted by dhxSupport on May 08, 2009 01:00

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 http://dhtmlx.com/docs/products/dhtmlxGrid/doc/articles/Creating_custom_skin.html#grid_cust_skin

Also there is possibility to create custom eXcell types and autocalculated values in the footer. Please see more information here 
http://dhtmlx.com/docs/products/dhtmlxGrid/doc/articles/Custom_excell_creation.html#grid_cexc
http://dhtmlx.com/docs/products/dhtmlxGrid/doc/articles/Custom_stat_counters.html#grid_art_custstat

Answer posted by Vikram on May 18, 2009 23:52
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.
Answer posted by Alex (support) on May 19, 2009 03:43

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:

grid.attachEvent("onStatReady",function(){

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.