This is a migrated thread and some comments may be shown as answers.

Two grids with side by side columns

3 Answers 126 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Vishal
Top achievements
Rank 1
Vishal asked on 12 Jun 2013, 12:01 PM
I have two grid with same number and type of columns. The number of rows are also same.
Only difference is the content of the grids.
Basically I want to show the difference in two grids for each column.
I want to show first column from both the grids, then second column from both the grids and so on.
How I can achieve this?

3 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 1
answered on 12 Jun 2013, 12:13 PM
Hi,

I guess you want to combine the columns from different table.Please have a look at this DEMO.This shows combining columns with multiple headers.Try if this helps.

Thanks,
Princy
0
Vishal
Top achievements
Rank 1
answered on 13 Jun 2013, 07:32 AM
Hi,

I want to combine the columns from different grids, not from different table.
I don't know the columns of these grids as they are dynamically build and can be different based on input.
But one thing is sure that both grids will have same number and type of columns.
I have to take each column from both the grids and show side by side.
Something like attached image.
0
Princy
Top achievements
Rank 1
answered on 13 Jun 2013, 08:53 AM
Hi,

I'm not sure if you can do it that way using two grid,to combine columns. i have tried it but no hope, but i have tried setting each column in different grid,and apply CSS property to combine the view.The code is as below.I have attached a screenshot to what i have done.

ASPX:
<telerik:RadGrid ID="RadGrid2" runat="server" DataSourceID="SqlDataSource1" Width="100px">
            <MasterTableView AutoGenerateColumns="false">
                <Columns>
                    <telerik:GridBoundColumn DataField="OrderID" HeaderText="OrderID" UniqueName="OrderID" />
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
        <br />
         <telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="SqlDataSource1" Width="100px" CssClass="style">
            <MasterTableView AutoGenerateColumns="false">
                <Columns>
                    <telerik:GridBoundColumn DataField="CustomerID" HeaderText="CustomerID" UniqueName="CustomerID" />
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
         <telerik:RadGrid ID="RadGrid3" runat="server" DataSourceID="SqlDataSource1" Width="100px" CssClass="style1">
            <MasterTableView AutoGenerateColumns="false">
                <Columns>
                    <telerik:GridBoundColumn DataField="ShipRegion" HeaderText="ShipRegion" UniqueName="ShipRegion" />
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
        <br />
         <telerik:RadGrid ID="RadGrid4" runat="server" DataSourceID="SqlDataSource1" Width="100px" CssClass="style2" >
            <MasterTableView AutoGenerateColumns="false">
                <Columns>
                    <telerik:GridBoundColumn DataField="ShipCity" HeaderText="ShipCity" UniqueName="ShipCity" />
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>

CSS:
<style type="text/css">
 .style
 {
  left: 110px;
  position:absolute;
  top: 8px;
  width: 100px;
 }
 .style1
 {
  left: 230px;
  position: absolute;
  top: 8px;
  width: 100px;
 }
 .style2
 {
  left: 332px;
  position: absolute;
  top: 8px;
  width: 100px;
 }
</style>

Thanks,
Princy
Tags
Grid
Asked by
Vishal
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 1
Vishal
Top achievements
Rank 1
Share this question
or