How to change the alternating row color, hide the grid head

Suite and Optimus Suite 5
#1

Grid v.3.5 build 120731.

I have three questions:

  1. How to change the row’s alternating color (the default is alternation of white and grey)?
    What if I want to change the grey color to something else?

2)How to hide the header of the grid?

Normally a text will be shown on the header. But I want to hide the header completely, just display the grid row, indead.

  1. How to hide the grid border so that it won’t show up or change the border color to almost invisible?

Thanks

Scott

#2
  1. How to change the row’s alternating color (the default is alternation of white and grey)?
    What if I want to change the grey color to something else?
    Please, try to use the enableAlterCss() method:
    grid.enableAlterCss(“even_row”,“odd_row”);
    even_row, odd_row - css classes.
    here you can find a tutorial:
    docs.dhtmlx.com/doku.php?id=dhtm … _grid_rows

2)How to hide the header of the grid?
Please, try to use the detachHeader() method:
docs.dhtmlx.com/doku.php?id=dhtm … tachheader

  1. How to hide the grid border so that it won’t show up or change the border color to almost invisible?
    Please, try to use the css:

<style> div.gridbox_dhx_skyblue{ border-width: 0px; } </style>

#3

–change the grid border

I set the grid skin to (“xp”). In the dhtmlxgrid.css, there is:

div.gridbox_xp{
border:1px solid lightgrey;
}

Currently, I can go to the file to change the setting to 0, but since this file is shared by many grids, for some, I still need the border.

How can I dynamically change the grid border to 0 using javascript?

Thanks

Scott

#4

Unfortunately such feature is not supported.
We may suggest you to create a custom skin:
docs.dhtmlx.com/doku.php?id=dhtm … n_creation

#5

By the way, try to align the header of the grid column (not the text).

For example:

User Name Location
Jon xxxxx
Mike xxxxx
Ted

I want the header label “User Name” to be center. How can I do that?

Thanks

#6

Please, try to use the following solution:

mygrid.setHeader("User Name, Location",null,["text-align:center;","text-align:left;"]);