Create Bottom Border for last row in Grid

[Jeremy Murtishaw]

Hi,

How can I create a bottom border just for the last row in my grid?  Currently my rows alternate between white and orange and when my grid only displays a few records and the last row is white there is no border between the row bottom and the white background of the grid.  I would prefer a border over changing my row colors.

Thanks,
Jeremy

[Jack]

Hello Jeremy Murtishaw,

You can do this by handling the CellFormatting event. Here is a sample:

void radGridView1_CellFormatting(object sender, CellFormattingEventArgs e)
{
    GridViewRowCollection rows = e.CellElement.RowElement.RowInfo.ViewTemplate.Rows;
    if (!e.CellElement.RowElement.IsCurrent && rows.IndexOf((GridViewDataRowInfo)e.CellElement.RowInfo) == rows.Count - 1)
    {
        e.CellElement.DrawBorder = true;
        e.CellElement.BorderBoxStyle = BorderBoxStyle.FourBorders;
        e.CellElement.BorderBottomWidth = 1;
        e.CellElement.BorderBottomColor = Color.Black;
        e.CellElement.BorderTopWidth = 0;
        e.CellElement.BorderLeftWidth = 0;
        e.CellElement.BorderRightWidth = 0;
        if (e.CellElement.Shape != null)
        {
            oldShape = e.CellElement.Shape;
            e.CellElement.Shape = null;
        }
    }
    else
    {
        e.CellElement.BorderBottomWidth = 0;
        e.CellElement.BorderLeftWidth = 0;
        e.CellElement.BorderRightWidth = ((GridDataCellElement)e.CellElement).IsLastDataCell ? 0 : 1;
        e.CellElement.BorderTopWidth = 0;
    }
}

If you have further questions, don't hesitate to ask.

Kind regards,
Jack
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Jeremy Murtishaw]

Hi Jack,

Your solution was what I was looking for, but with 2 caveats.

1.  If the last row contains child elements, the border does not exist under the plus/expand sign (not a huge deal).
2.  If the last row contains child elements and I expand it then arrow down to the child elements, the border still exists under the parent row.  Ideally, the border would move from bottom of the parent cell to the bottom of the last child when expanded and then back to the parent when collapsed.  If doing that would become too messy, then at the very least could the border disappear from the parent when expanded?

Thanks,
Jeremy

[Jack]

Hi Jeremy,

I understand. CellFormatting event is fired only for data cells. You should handle ViewCellFormatting to add border under the expander cell. The child view is shown in a separate row, which is not a data row. So, you should handle in this case ViewCellFormatting as well. Please take a look at the sample below:

ElementShape oldShape;

void radGridView1_ViewCellFormatting(object sender, CellFormattingEventArgs e)
{
    if (e.CellElement.RowInfo is GridViewDataRowInfo &&
        (e.CellElement is GridDataCellElement || e.CellElement is GridGroupExpanderCellElement))
    {
        GridViewRowCollection rows = e.CellElement.RowElement.RowInfo.ViewTemplate.Rows;
        if (!e.CellElement.RowElement.IsCurrent && rows.IndexOf((GridViewDataRowInfo)e.CellElement.RowInfo) == rows.Count - 1 &&
            !e.CellElement.RowInfo.IsExpanded &&
            e.CellElement.ViewTemplate.Parent == null)
        {
            e.CellElement.DrawBorder = true;
            e.CellElement.BorderBoxStyle = BorderBoxStyle.FourBorders;
            e.CellElement.BorderBottomWidth = 1;
            e.CellElement.BorderBottomColor = Color.Black;
            e.CellElement.BorderTopWidth = 0;
            e.CellElement.BorderLeftWidth = 0;
            e.CellElement.BorderRightWidth = 0;
            if (e.CellElement.Shape != null)
            {
                oldShape = e.CellElement.Shape;
                e.CellElement.Shape = null;
            }
        }
        else
        {
            e.CellElement.BorderBottomWidth = 0;
            e.CellElement.BorderLeftWidth = 0;
            if (e.CellElement is GridDataCellElement)
            {
                e.CellElement.BorderRightWidth = ((GridDataCellElement)e.CellElement).IsLastDataCell ? 0 : 1;
            }
            e.CellElement.BorderTopWidth = 0;
        }
    }

    if (e.CellElement is GridDetailViewCellElement)
    {
        GridViewRowCollection rows = e.CellElement.RowElement.RowInfo.ViewTemplate.Rows;
        GridViewDetailsRowInfo detailsRowInfo = (GridViewDetailsRowInfo)e.CellElement.RowInfo;
        if (rows.IndexOf(detailsRowInfo.Parent) == rows.Count - 1)
        {
            e.CellElement.DrawBorder = true;
            e.CellElement.BorderBoxStyle = BorderBoxStyle.FourBorders;
            e.CellElement.BorderBottomWidth = 1;
            e.CellElement.BorderBottomColor = Color.Black;
        }
        else
        {
            e.CellElement.BorderBottomColor = Color.FromArgb(160, 160, 160);
        }
    }
}

Should you have any other questions, I will be glad to help.

Regards,
Jack
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Jeremy Murtishaw]

Thanks for all of your help so far.  I think I only have one outstanding issue left.  For the DataRows in the CellFormatting event you used this function to remove the right border for the last cell

e.CellElement.BorderRightWidth = ((GridDataCellElement)e.CellElement).IsLastDataCell ? 0 : 1;

How do I do the same for the expanded child rows in the ViewCellFormatting event? 

[Jack]

Hi Jeremy,

You can use the same code when handling ViewCellFormatting. In fact, I am using this code in my last sample at line 32. However, the IsLastCell property is available only for data cells. So, you should first check whether the cell is GridDataCellElement.

Maybe I can't understand what exactly is your intention. If so, please describe it giving us mode details. I will be glad to help further.

Sincerely yours,
Jack
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Jeremy Murtishaw]

Hi Jack,
Let me try and clarify:
Is there a way to have that same code in a GridDetailViewCellElement cell?  I'm using your sample code from above and for the "if (e.cellelement = GridDetailViewCellElement)" block, I wanted it to display with just a bottom border as well as a right border for all cells except the last cell in the row.  So below is what I tried to do inside that block, but since its not a DataCell I got a type cast error for the right border width.  So my question is how to get a right border on all but the last cell?

if (e.cellelemnt = GridDetailViewCellElement)
{
....


e.CellElement.DrawBorder = true;
 e.CellElement.BorderBoxStyle = Telerik.WinControls.BorderBoxStyle.FourBorders;
 e.CellElement.BorderTopWidth = 0;
 e.CellElement.BorderLeftWidth = 0;
 e.CellElement.BorderBottomWidth = 1;
e.CellElement.BorderRightWidth = ((GridDataCellElement)e.CellElement).IsLastDataCell ? 0 : 1;
 e.CellElement.BorderBottomColor = Color.LightGray;
....
}

Thanks,
Jeremy

[Jack]

Hi Jeremy,

ViewCellFormatting event is called for every cell regardless if it is a part from the child view in the hierarchy or not. I added the following condition in my code to prevent changing the border for child rows:

e.CellElement.ViewTemplate.Parent == null

I noticed that my code removes the right border for the last row. So I modified a little my code. Here it is:

void radGridView1_ViewCellFormatting(object sender, CellFormattingEventArgs e)
{
    if (e.CellElement.RowInfo is GridViewDataRowInfo &&
        (e.CellElement is GridDataCellElement || e.CellElement is GridGroupExpanderCellElement))
    {
        GridViewRowCollection rows = e.CellElement.RowElement.RowInfo.ViewTemplate.Rows;
        if (!e.CellElement.RowElement.IsCurrent && rows.IndexOf((GridViewDataRowInfo)e.CellElement.RowInfo) == rows.Count - 1 &&
            !e.CellElement.RowInfo.IsExpanded)
            //&& e.CellElement.ViewTemplate.Parent == null)
        {
            e.CellElement.DrawBorder = true;
            e.CellElement.BorderBoxStyle = BorderBoxStyle.FourBorders;
            e.CellElement.BorderBottomWidth = 1;
            e.CellElement.BorderBottomColor = Color.Black;
            e.CellElement.BorderTopWidth = 0;
            e.CellElement.BorderLeftWidth = 0;
            if (e.CellElement is GridDataCellElement)
            {
                e.CellElement.BorderRightWidth = ((GridDataCellElement)e.CellElement).IsLastDataCell ? 0 : 1;
            }
            else
            {
                e.CellElement.BorderRightWidth = 0;
            }
            if (e.CellElement.Shape != null)
            {
                oldShape = e.CellElement.Shape;
                e.CellElement.Shape = null;
            }
        }
        else
        {
            e.CellElement.BorderBottomWidth = 0;
            e.CellElement.BorderLeftWidth = 0;
            if (e.CellElement is GridDataCellElement)
            {
                e.CellElement.BorderRightWidth = ((GridDataCellElement)e.CellElement).IsLastDataCell ? 0 : 1;
            }
            e.CellElement.BorderTopWidth = 0;
        }
    }

    if (e.CellElement is GridDetailViewCellElement)
    {
        GridViewRowCollection rows = e.CellElement.RowElement.RowInfo.ViewTemplate.Rows;
        GridViewDetailsRowInfo detailsRowInfo = (GridViewDetailsRowInfo)e.CellElement.RowInfo;
        if (rows.IndexOf(detailsRowInfo.Parent) == rows.Count - 1)
        {
            e.CellElement.DrawBorder = true;
            e.CellElement.BorderBoxStyle = BorderBoxStyle.FourBorders;
            e.CellElement.BorderBottomWidth = 1;
            e.CellElement.BorderBottomColor = Color.Black;
        }
        else
        {
            e.CellElement.BorderBottomColor = Color.FromArgb(160, 160, 160);
        }
    }
}

I hope that we are getting closer to the target. If you have more questions, don't hesitate to ask.

All the best,
Jack
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.