Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted on May 28, 2009 03:12
open dhtmlx forum
DHtmlGrid styles

How to set the alternate colors to the rows in dhtmlxgrid
Answer posted by dhxSupport on May 28, 2009 03:45
Answer posted on May 28, 2009 03:52

I tried the example given by you in the second link..But its not working..

<title>dhtmlxGrid Sample Page</title>

<link rel="STYLESHEET" type="text/css" href="../codebase/dhtmlxgrid.css">

<script src="codebase/dhtmlxcommon.js"></script>

<script src="../codebase/dhtmlxgrid.js"></script>

<script src="../codebase/dhtmlxgridcell.js"></script>

<style>

.even{

background-color:#E6E6FA;

}

.uneven{

background-color:#F0F8FF;

}

</style>

<script>

var mygrid;

function doInitGrid(){

mygrid = new dhtmlXGridObject('mygrid_container');

mygrid.setImagePath("codebase/imgs/");

mygrid.setHeader("Model,Qty,Price");

mygrid.setInitWidths("*,150,150");

mygrid.setColAlign("left,right,right")

mygrid.setSkin("light");

mygrid.setColSorting("str,int,int");

mygrid.setColTypes("ed,ed,price");

mygrid.enableAlterCss("even","uneven");

mygrid.setColumnColor("white,#d5f1ff,#d5f1ff")

mygrid.attachEvent("onRowSelect",doOnRowSelected);

mygrid.init();

mygrid.loadXML("step3.xml");

}

function addRow(){

var newId = (new Date()).valueOf()

mygrid.addRow(newId,"",mygrid.getRowsNum())

mygrid.selectRow(mygrid.getRowIndex(newId),false,false,true);

}

function removeRow(){

var selId = mygrid.getSelectedId()

mygrid.deleteRow(selId);

}

function doOnRowSelected(rowID,celInd){

alert("Selected row ID is "+rowID+"\nUser clicked cell with index "+celInd);

}

</script>

<body onload="doInitGrid()">

<div id="mygrid_container" style="width:600px;height:150px;"></div>

</body>

Please advice..

regards

uthra

Answer posted by dhxSupport on May 28, 2009 05:20
Such issue occurs because of you are using mygrid.setColumnColor("white,#d5f1ff,#d5f1ff"). Color of a whole column has higher priority then color of even/uneven row.