Skin & color of footer's grid?

Hello every body,



Can i change the skin (or color) of my footer rows of my grid ?

are there methods for doing this?



Thanks for any help.



best regards.

You can customize default skin colors in dhtmxgrid.cs
    div.gridbox div.ftr td {   // this rule define default footer
    div.gridbox_light div.ftr td { // footer classes for specific skins

Also, you can set some custom styles directly from attachFooter command
    grid.attachFooter(“A,B,C”,[“bacground-color:green;”,“bacground-color:red;”,“bacground-color:blue;”]);
   


Hello,



I change the dhtmlxgrid.css file by adding caracteristic properties but it don’t work ,my footers take the yellow color even i choice th bleu color ?



this my class css :



div.gridbox_light div.ftr td {



background-color:#B0C4DE;



}



 



but should i add something  for doing this?



best regards

Which skin are you using ?  the class name is

div.gridbox_[skin name here] div.ftr td {

the

div.gridbox_light div.ftr td {


rule will work for “light” skin, if you are using “modern” skin for example, the css rule must be


div.gridbox_modern div.ftr td {

same for other skins


i’am using a light skin as and i declare this



div.gridbox_light div.ftr td {



background-color:#B0C4DE;



}



 



in my dhtmlXgrid.css



 



but my footers werr shawn in a yellow color --> so my css class deosen’t be identified



and see the construction of my grid :



<jsp:directive.page import=“com.tutelec.bl.constants.GniScreenItem”/>



<div align=“center”>



<div id=“messanger”> </div>



<div id=“gridboxDepenses” width=“100%” height=“300px” style=“background-color:white;overflow:hidden;”></div>



<br/>



<div id=“recinfoAreaDepenses”></div>



<br/>



<div align=“center”><span id=“recfoundTuDepenses”></span></div>


<script type=“text/javascript”>



function eXcell_edncl(cell){



this.base = eXcell_edn;



this.base(cell)



this.setValue = function(val){



if(!val || val.toString()._dhx_trim()=="")



val=“0”



if(val>=0)



this.cell.style.color = “green”;



else



this.cell.style.color = “red”;



this.cell.innerHTML = this.grid._aplNF(val,this.cell._cellIndex);



}


}



eXcell_edncl.prototype = new eXcell_edn;


//extended simple editor (with number format support) to be readonly



function eXcell_ednro(cell){



this.base = eXcell_edn;



this.base(cell)



this.edit = function(){



return false;



}



this.detach = function(){



return false;



}



}


eXcell_ednro.prototype = new eXcell_edn;


showMessage = function( msg ){



var msger = document.getElementById( “messanger” );



msger.innerHTML = msg;



}


var mygridDepenses = new dhtmlXGridObject( ‘gridboxDepenses’ );



var mygridHeadersDepenses = “Code comptable, Libellé, Libellé Utilisateur,JAN, FEV, MAR, AVR, MAI, JUN, JUI,AOU, SEP, OCT, NOV, DEC, Totaux” ;



var mygridSerializableColumnsDepenses = “true,true,true,true,true,true,true,true,true,true,true,true,true,true,true,true,true”;



mygridDepenses.setImagePath( “…/html/img/dhtmlxGrid/” );



mygridDepenses.chNoState = “false”;



mygridDepenses.setSkin( “light” );



mygridDepenses.enableLightMouseNavigation( false );



mygridDepenses.setHeader( mygridHeadersDepenses );



mygridDepenses.enableCSVHeader(true);



mygridDepenses.setSizes();



mygridDepenses.setInitWidths(“100,100,100,100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100”);



mygridDepenses.setColTypes(“ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro”);


mygridDepenses.setSerializableColumns( mygridSerializableColumnsDepenses );



mygridDepenses.setColSorting(“str,str,str,str,str,str,str,str,str,str,str,str,str,str,str,str,int” );



mygridDepenses.enableMultiselect( true );



mygridDepenses.enablePagingWT(true, 10, 3, “recinfoAreaDepenses”);



mygridDepenses.setColAlign(“center,center,center,center,center,center,center,center,center,center,center,center,center,center,center,center,center”);


//Footers



//mygridDepenses.attachFooter(“Test”,[“bacground-color:green;”]);


mygridDepenses.attachFooter("Total Dépenses,#cspan,#cspan, , , , , , , , , , , , , ");



mygridDepenses.attachFooter("Réalisé,#cspan,#cspan, , , , , , , , , , , , , ");



mygridDepenses.attachFooter("Ecart,#cspan,#cspan, , , , , , , , , , , , , ");



mygridDepenses.attachFooter("Bilan mensuel,#cspan,#cspan, , , , , , , , , , , , , ");



mygridDepenses.attachFooter("Bilan Cumulé,#cspan,#cspan, , , , , , , , , , , , , ");


mygridDepenses.init();



myDataProcessorDepenses = new dataProcessor() ;



myDataProcessorDepenses.setUpdateMode(“off”);



myDataProcessorDepenses.init( mygridDepenses );


fill_grid = function(){



dojo.debug('fill_grid() :: START ');



showLoadingTuRemboursements();



var kw = {



url : ‘tuTuBudgetAnnuelDepenses.tdojo’,



sync : true,



content : { inline: “yes”, action: “select” },



formNode: dojo.byId(‘tuBudgetAnnuelForm’),



load : function(evt, json) {



//dojo.debug( “Search Result = " + json );



if (json == “<?xml version=\"1.0\" encoding=\"UTF-8\"?>” ){



mygridDepenses.clearAll();



showMessage(“Aucun enregistrement trouvé.”);



}



else{



showMessage(”");



hideSearchProgressDialog();



mygridDepenses.clearAll();



mygridDepenses.loadXMLString(json);



}



}



};



dojo.debug('fill_grid() :: bind ');



dojo.io.bind(kw);



dojo.debug('fill_grid() :: END ');



}





</script>



</div>



thanks for any help