How to provide the Header Text for first column, while using the NestedViewTemplate in RadGrid ?

[Kannan]

I need to give the header text for the first column, while using the NestedViewTemplate in RadGrid.

I am getting 508 compliance error as "Empty Table Header", for the first column. I have attached screenshot, which is not having Header Text.

[Doncho]

Hello Kannan,

There is no text in the header cell of the Expand/Collapse column, which is causing the error you get. 

In fact, there are multiple resources and discussions on the topic of whether the missing text in a table cell is actually an accessibility issue and how to fix that:

• accessibility for empty table cells - StackOverflow (SO)
• What's the best way to represent an empty TH in HTML5? - SO
• Is it good to put a &nbsp; inside an empty <td>? - SO
• Empty cells in HTML tables - article

In case passing the 508 compliance evaluation is required, you can use some custom JavaScript to add text in the respective table cell. You can make the text invisible and use an aria-label for adding some accessibility information:

$telerik.$(document).ready(function () {
    var headerCell = $telerik.$('.RadGrid .rgHeader.rgExpandCol');
    headerCell.text("-");
    headerCell.css("color", "transparent");
    headerCell.attr("aria-label", "ExpandColumn");
})

I hope this information will prove helpful. Please let me know if any questions come up.

Kind regards,
Doncho
Progress Telerik