View Full Version : Merging cells in a grid

18 Aug 2009, 7:08 AM
Hi all,

After reading through a lot of posts, I found out that there is no definitive way in which we can merge rows/columns in grids. My basic aim is to try and re-create something like a Microsoft Outlook calendar with items spanning over multiple days.

As a work around, I am thinking of using a very nice CSS hack of setting the margin as negative which allows text to overflow recklessly, giving the illusion of merged cells ;) But, this means that my store will be extremely complicated. So will my renderer, because of the million cases it will have to handle.

So, my question is, should I still stick to grids and use this workaround, or does anybody know any easier way in which this can be done?

Thanks a million!

18 Aug 2009, 7:18 AM
GridView will never support this and negative margins won't work on all browsers.

You are probably best off with creating a custom component that renders a table (day/hour matrix) and allows absolutely positioned elements (events) to be placed over it.

18 Aug 2009, 7:21 AM
How do you merge them on the data level? (recall that each grid row corresponds to a grid's store record)

How about using the old plain table with rowspan attribute?

18 Aug 2009, 7:49 AM
I would go for absolutely positioned elements. That way you can use a DataView to render data from a store (needs a very specific template however).

18 Aug 2009, 11:36 PM
Thanks for all the replies. I have one more doubt regarding this. I also have the need for a multi-cell selection model, which applies on individual cells. i.e. even if the data is merged on these cells, I should be able to select the constituent cells separately. Would it still be a good idea to go ahead with absolutely positioned elements or should I use these features already provided in a grid?

Thanks again!