RadGrid for ASP.NET AJAX

RadControls for ASP.NET AJAX

This online example demonstrates how to create Section 508 compliant RadGrid. The paging and sorting features of the control are switched on by using pager template with asp Buttons and push buttons in the column headers. No client features are enabled because one of the prerequisites for section 508 compliance is to ensure that your control operates normally with javascript execution disabled through the browser options.

Covering this criterion is very important when you would like to make your components accessible to people with disabilities.

The Section 508 standards are listed on the official government site:

Section 508

Here are the code snippets from the aforementioned sample:

CopyASPX
<head runat="server">
  <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;        
    }        
    .RadGrid_<%= MyGrid1.Skin %> th, .RadGrid_<%= MyGrid1.Skin %> td         
    {
        white-space:nowrap;        
    }
  </style>
</head>
<body class="BODY">
  <form runat="server" id="mainForm" method="post" style="width: 100%;">
  <div>
    <telerik:MySection508Grid ID="MyGrid1" Skin="Sunset" DataSourceID="SqlDataSource1"
      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:MySection508Grid>
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
      ProviderName="System.Data.SqlClient" SelectCommand="SELECT CustomerID, CompanyName, ContactName, ContactTitle, Address FROM Customers" />
  </div>
  </form>
</body>