GroupHeaderGrid - Grouped grid column headers

[J@y]

How can I only group the first level of headers (the original column headers)?

In other words, to replace the existing column header instead of adding a header row to represent a group header.

thanks

[Condor]

The original (first-level) headers need to be rendered, because the GridPanel baseclass expects them to be present.

But that doesn't mean you can't hide them with display:none!

[J@y]

The original (first-level) headers need to be rendered, because the GridPanel baseclass expects them to be present.

But that doesn't mean you can't hide them with display:none!

Thanks, so do you mean I've to explicitly get the DOM of header and set the CSS to display:none?

any faster way to achieve this?

PS: I've tried to inspect the DOM in firebug and set the <div> to display:none, the header space is still exist in the <td> ...
If I set the <td> to display:none, the whole header's layout will be corrupted. But I can't add the colspan to the grid original header...

Since this groupHeader plugin renders the header rows in separate <table>s, the alignment of header cells cannot be dependently aligned.

[hellogavin]

Thank you for your share

[Thomas Triplet]

Fantastic piece of work. Thanks Condor; works beautifully.

+1000

[calavera]

Great share! I have noticed that the dataIndex column defined in the GroupHeaderGrid becomes unsortable. Only the first column has this problem.

LE: The next group of header column has no working sortable column...Any fixes ?

Thanks.

[Condor]

Great share! I have noticed that the dataIndex column defined in the GroupHeaderGrid becomes unsortable. Any fix for this ? Only the first column has this problem.

Can you reproduce the problem with the provided example?

If not, can you post an example that does?

[Palastanga]

Thank you so, so much for sharing this! It's exactly what I was looking for.

[Palastanga]

Condor:

I'm trying to dynamically update the GroupHeader header value from store JSON data but I'm having problems.

This is because I want the dynamic JSON response from the store to update my Group Column Headers. I'm making a 2 day calendar style grid view - so my previous and next buttons load the store and return data and 2 new dates/days which I want to display in the header.

I currently do this to standard GridPanel columnHeaders by doing either:

myStore.on('load', function() {
      myColumnModel.setConfig([
                {header: "New Header", dataIndex: 'foo'}
      ])
}

or with:

myStore.on('load', function() {
     myColumnModel.setColumnHeader(1, 'New Header');
}

|        Tuesday       |     Wednesday        |
-----------------------------------------------
| 8 | 9 | 10 | 11 | 12 | 8 | 9 | 10 | 11 | 12 |
-----------------------------------------------

I want to change Tuesday/Wednesday dynamically to values from my JSON.

If you have any suggestions for how I could implement this I would be eternally grateful! Sorry if i've rambled on with too useless detail.

Thanks
Martin

[Condor]

Modify grid.getColumnModel().rows and call grid.getView().updateHeaders() (calling grid.getColumnModel().setConfig() will also update the headers).