This is a migrated thread and some comments may be shown as answers.
Remove column separator
2 Answers 13 Views
This is a migrated thread and some comments may be shown as answers.
Malin
Top achievements
Rank 1
Malin asked on 07 Jun 2018, 01:17 PM

Hi,

We want to remove the column separators in the RadListView control (DetailsView) and set the headers to align to the left (see the attached image).

We can do this in design view by going in to the Edit UI Elements-dialog and go to the DetailsListViewColumnContainers Children property and edit our two columns DrawBorder-property to false and TextAlignment-property to MiddleLeft. The problem is when we do that and run our project we get a runtime error, ArgumentOutOfRangeException, on the first row, of the ones down below. Is this not the way to remove the separators? Is there a better way to achieve this?

 

ArgumentOutOfRangeException on the first of these rows (more specifically the last GetChildAt() fails):

((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(0))).DrawBorder = false;((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(0))).TextAlignment = System.Drawing.ContentAlignment.MiddleLeft;((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(0))).Text = "Server";((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(1))).DrawBorder = false;((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(1))).TextAlignment = System.Drawing.ContentAlignment.MiddleLeft;((Telerik.WinControls.UI.DetailListViewHeaderCellElement)(this.radListViewServer.GetChildAt(0).GetChildAt(0).GetChildAt(3).GetChildAt(1))).Text = "Kommentar";

2 Answers, 1 is accepted

Sort by
0
Malin
Top achievements
Rank 1
answered on 07 Jun 2018, 01:25 PM
We are using version 2017.1.117.40
0
Dess | Tech Support Engineer, Sr.
Telerik team
answered on 07 Jun 2018, 01:53 PM
Hello, Malin,  

The appropriate way to customize cell elements in details view is to handle the CellFormatting event. Here is demonstrated a sample code snippet how to hide the borders and change the text alignment in the header cells:
private void radListView1_CellFormatting(object sender, Telerik.WinControls.UI.ListViewCellFormattingEventArgs e)
{
    DetailListViewHeaderCellElement headerCell = e.CellElement as DetailListViewHeaderCellElement;
    if (headerCell != null)
    {
        e.CellElement.DrawBorder = false;
        e.CellElement.TextAlignment = ContentAlignment.MiddleLeft;
    }
    else
    {
        e.CellElement.ResetValue(LightVisualElement.DrawBorderProperty, Telerik.WinControls.ValueResetFlags.Local);
        e.CellElement.ResetValue(LightVisualElement.TextAlignmentProperty, Telerik.WinControls.ValueResetFlags.Local);
    }
}

I hope this information helps. If you have any additional questions, please let me know. 

Regards,
Dess
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Asked by
Malin
Top achievements
Rank 1
Answers by
Malin
Top achievements
Rank 1
Dess | Tech Support Engineer, Sr.
Telerik team
Share this question
or