ListBox - WCAG 2.0 and Section 508 Accessibility Compliance

  • Amsterdam
  • Barcelona
  • Bonn
  • Boston
  • Brussels
  • Dallas
  • Denver
  • Dublin
  • Liverpool
  • London
  • Madrid
  • Miami
  • Moscow
  • New York
  • Oslo
  • Paris
  • San Francisco
  • Seattle
  • Sofia
  • St.Paul
Validate with WAVE
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

Telerik RadListBox for ASP.NET AJAX is compliant with Section 508 and level AA of the W3C Web Accessibility Guidelines 2.0. Run WAVE, the automated web accessibility evaluation tool, to check the accessibility level of the control yourself.

This example shows the accessibility features of RadListBox for ASP.NET AJAX. RadListBox has keyboard navigation enabled as well as its ToolTip property set. The arrow images render tooltips as well.

The control is also visible in Windows High Contrast mode when using Simple skin.

  • DefaultCS.aspx
  • styles.css
<%@ Page Language="C#"  %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "">
<html xmlns=''>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link rel="stylesheet" type="text/css" href="styles.css" />

    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />

    <div class="demo-container size-narrow">
        <telerik:RadListBox RenderMode="Lightweight" runat="server" ID="RadListBox1" SelectionMode="Multiple" TabIndex="1"
            ToolTip="Source list" AllowReorder="true" AccessKey="y" Height="250" AllowDelete="true"
            Width="225px" AllowTransfer="true" TransferToID="RadListBox2">
            <ButtonSettings ShowDelete="false" RenderButtonText="true"></ButtonSettings>
                <telerik:RadListBoxItem Text="Amsterdam" />
                <telerik:RadListBoxItem Text="Barcelona" />
                <telerik:RadListBoxItem Text="Bonn" />
                <telerik:RadListBoxItem Text="Boston" />
                <telerik:RadListBoxItem Text="Brussels" />
                <telerik:RadListBoxItem Text="Dallas" />
                <telerik:RadListBoxItem Text="Denver" />
                <telerik:RadListBoxItem Text="Dublin" />
                <telerik:RadListBoxItem Text="Liverpool" />
                <telerik:RadListBoxItem Text="London" />
                <telerik:RadListBoxItem Text="Madrid" />
                <telerik:RadListBoxItem Text="Miami" />
                <telerik:RadListBoxItem Text="Moscow" />
                <telerik:RadListBoxItem Text="New York" />
                <telerik:RadListBoxItem Text="Oslo" />
                <telerik:RadListBoxItem Text="Paris" />
                <telerik:RadListBoxItem Text="San Francisco" />
                <telerik:RadListBoxItem Text="Seattle" />
                <telerik:RadListBoxItem Text="Sofia" />
                <telerik:RadListBoxItem Text="St.Paul" />
        <telerik:RadListBox RenderMode="Lightweight" runat="server" ID="RadListBox2" Width="225" Height="250" TabIndex="2"
            ToolTip="Destination list" SelectionMode="Multiple">

    <asp:LinkButton ID="LinkButton1" runat="server" OnClick="LinkButton1_Click" Text="Validate with WAVE" />

    <script runat="server">
        protected void LinkButton1_Click(object sender, EventArgs e)
            Response.Redirect("" + Page.Request.Url.AbsoluteUri);

Find Assistance

Help Us Improve

Was this example helpful?