Display GridView with many columns as two sets of columns

Question

I apologize for the odd title. I've been trying to figure out how to do this and can't quite put it into words. Basically, I need to try to display a GridView with a whole bunch of columns (37 in one case) in two "rows" of columns. More or less.

So instead of this:

Column1 Column2 Column3 Column4 Column5 Column6
Data    Data    Data    Data    Data    Data
Data    Data    Data    Data    Data    Data
Data    Data    Data    Data    Data    Data

I'd like something like this:

Column1 Column2 Column3
Data    Data    Data
Data    Data    Data
Data    Data    Data

Column4 Column5 Column6
Data    Data    Data
Data    Data    Data
Data    Data    Data

As in the example there can be multiple rows returned which all need to be displayed. I'm trying to stop a very large horizontal scroll bar being required. I've been searching as much as I can but haven't found anything that fits what I'm looking for. Any help would be appreciated.

Answer 1

I'd use 2 gridviews. I'd fetch the data in the code behind and cache it in a datatable. I'd then make 2 dataviews - the 1st one taking the 1st 3 columns; the 2nd one showing the last 3 columns. And then pass dataview1 to gridview1 and dataview2 to gridview2 and databind.

alternatively,

If you are simply worried that the page might overflow with horizontal scrolling, put the gridview in a div tag with style overflow scroll

<div style="overflow:scroll; width:95%">
<!-- gridview goes here -->
</div>