Hide Grid Header

How do I hide all grid headers? I want the column to show up but not the header.

quick and dirty css

Code:

---

<style type="text/css">
.x-grid-header {
    display:none;
}
</style>

---

that will of course hide all headers of all grids on that page.

Code:

---

<style type="text/css">
#gridid .x-grid-header {
    display:none;
}
</style>

---

change #gridid to the id of your grid and it will only hide the header for the grid that you dont want it to show for.

Thanks guys. I figured I was missing config option in one of the many objects needed to create a grid.

On that note, perhaps this would be a useful config option?

The Problem is that it needs to be done in css.

I think it just needs to be outlined better in the documentation. I'll make sure and make a not of it for the documentation team to make sure and include.

Quote:

---

Originally Posted by jon.whitcraft

Code:

---

<style type="text/css">
#gridid .x-grid-header {
    display:none;
}
</style>

---

change #gridid to the id of your grid and it will only hide the header for the grid that you dont want it to show for.

---

Thanks. It works for me.

Hi,

I just cannot figure out why this is not working for me.

I am using yui-ext-33

Using grid

var configureColGrid = new YAHOO.ext.grid.Grid('srarch', srarchDataModel, srarchlColumnModel);

Used style sheet
<style type="text/css">
#gridid .x-grid-header {
display:none;
}
</style>

But my grid headers are still visible

Please guide me.


Thanks.

Class names were different waaaaay back then!

Use Firebug to find uot which class you have to hide.

...so is there a way to hide the column headers through javascript - i.e. not with CSS?

I'm using this code to hide the grid header:

Code:

---

var gridHead = grid.getGridEl().child('div[class=x-grid3-header]');
gridHead.setStyle('display', 'none');

---

This is assuming the class of the header is "x-grid3-header". Use Firebug to inspect and verify.

If you want to see it in action goto: http://qwikioffice.com/ExtJS-Demos/FormGrid/