Ever wonder how to make a pageable & sortable grid Section 508 compliant? Well with RadGrid this is trivial task! The tricky part is to tell the grid to not render or require any JavaScript on the page:
1. Inherit from RadGrid and override three methods:
public class MyGrid : RadGrid
{
public MyGrid()
{
//
}
protected override void RegisterScriptControl()
{
// do not register as ScriptControl
}
protected override void RegisterScriptDescriptors()
{
// do not register script descriptors
}
protected override void RegisterCssReferences()
{
// do not register css references
}
}
2. Add the grid to your page, define header button type for all grid columns & pager template:
<telerik:MyGrid ID="MyGrid1" Skin="Sunset" DataSourceID="LinqDataSource1" AllowPaging="true"
AllowSorting="true" runat="server" OnColumnCreated="MyGrid1_ColumnCreated">
<MasterTableView Caption="Customers" Summary="Customers">
<PagerTemplate>
Change page: <asp:Button ID="Button1" ToolTip="Previous Page" CommandName="Page" CommandArgument="Prev" CssClass="rgPagePrev" runat="server" />
<asp:Button ID="Button2" ToolTip="Next Page" CommandName="Page" CommandArgument="Next" CssClass="rgPageNext" runat="server" />
</PagerTemplate>
</MasterTableView>
</telerik:MyGrid>
protected void MyGrid1_ColumnCreated(object sender, GridColumnCreatedEventArgs e)
{
e.Column.HeaderButtonType = GridHeaderButtonType.PushButton;
}
3. Make the grid pretty:
<link type="text/css" rel="stylesheet" href="Skins/Sunset/Grid.Sunset.css" />
<style type="text/css">
.RadGrid_<%= MyGrid1.Skin %> th input
{
border:0px;
background-color: Transparent;
font-weight:bold;
cursor: pointer;
color:White;
text-align:left;
}
</style>
Enjoy!
Live Demo | Download