ColSpan in ItemDataBound

[License]

I need to be able to occasionally span a Text value across 3 NumericColumns when those columns are not relevant. I have attached a screenshot where I have cleared the appropriate columns and added the Text info. Now I need to know how to span the text from Column 1 into Column 2 and 3 without affecting the column headers or the data in other rows.

Here are a few snippets of my code to show what I'm working with:

CODE-BEHIND (ItemDataBound)

If Not IsDBNull(dataRow("span_data")) Then
 For Each col As GridColumn In TryCast(sender, RadGrid).MasterTableView.RenderColumns
   Select Case col.UniqueName
     Case "column1"
       col.ItemStyle.HorizontalAlign = HorizontalAlign.Leftrow("column1_data").Text = CStr(dataRow("span_data"))
     Case "column2"
       row("column2_data").Text = " "
     Case "column3"
       row("column3_data").Text = " "
   End Select
 Next
End If

FRONT-END

<telerik:GridNumericColumn HeaderText="Column 1" HeaderStyle-Width="80px" ItemStyle-HorizontalAlign="Right" DataField="column1" UniqueName="column1" SortExpression="column1" DataFormatString="{0:$#,##0;($#,##0);$#,##0}" />

<telerik:GridNumericColumn HeaderText="Column 2" HeaderStyle-Width="80px" ItemStyle-HorizontalAlign="Right" DataField="column2" UniqueName="column2" SortExpression="column2" DataFormatString="{0:$#,##0;($#,##0);$#,##0}" />

<telerik:GridNumericColumn HeaderText="Column 3" HeaderStyle-Width="80px" ItemStyle-HorizontalAlign="Right" DataField="column3" UniqueName="column3" SortExpression="column3" DataFormatString="{0:$#,##0;($#,##0);$#,##0}" />

[Venelin]

Hello Robert,

This is not supported out-of-the-box, but you can achieve the desired effect by setting the ColSpan property of the cell in question (from "span data", Column 1) to be equal to 3 in this specific case and set Visible="false" for the successive two cells. I've never tested such scenario (because as i've said it's not supported), but at first glance it should work, at least in the modern browsers.

Regards,
Venelin
Telerik

 

 

[License]

Thanks Venelin,

That works great! The only issue that is occurring is that when I sort my grid and a row with spanning columns is on top, the header rows are off slightly. I believe it may have to do with the vertical borders between columns that are being removed when the columns are combined. Any idea how to offset this from happening?

-Robert

[Venelin]

Hi Robert,

Strangely, I expected this to happen, but after I tested it  the same is not appearing on my side (see attached image). Keep in mind that many functionalities won't work as they were before, because there are "edge" cases that you should handle manually, RadGrid can't just handle such change in the rendering automatically.

Regards,
Venelin
Telerik

 

 

[License]

I am mixing columns which have ItemStyle-Widths set and others that are left to adjust themselves. I hardcoded all the columns to have set widths and this fixed the issue. Not ideal but it should work since I only need to have this functionality on 1 grid.

Thanks.

[Venelin]

Hello Robert,

Just to mention that you should never use ItemStyle-Width property, it exists only because it's inherited. Instead, only HeaderStyle-Width should be used and it's sufficient.

Regards,
Venelin
Telerik

 

 

[License]

Good catch. I actually am using the HeaderStyle-Width, I just typed ItemStyle accidentally.