input elemens causing section 508 failure

3 posts, 0 answers
  1. Adam Nelson
    Adam Nelson avatar
    50 posts
    Member since:
    Mar 2008

    Posted 21 Mar 2008 Link to this post

    Hello,

    We are using the Prometheus Calendar control as a datepicker similar to the Shared Calendar Example

    One of our customers is running the app through HiSoftware's AccVerify tool to ensure the application is Section 508 compliant.

    If i run the shared calendar example through the tool and clear the date fields, the control is failing with the following errors:

    <snip>
    Rule: 1.1.2 - All INPUT elements are required to contain the alt attribute or use a LABEL.
    • Failure - INPUT Element, of Type TEXT, found at Line: 183, Column: 110
    • Failure - INPUT Element, of Type TEXT, found at Line: 187, Column: 129
    • Failure - INPUT Element, of Type TEXT, found at Line: 187, Column: 215

    <snip>

    If i run the example through the tool without clearing the fields, it generates the following warnings that are still considered to be failures:

    <snip>
    Rule: 1.1.2 - All INPUT elements are required to contain the alt attribute or use a LABEL.
    • Warning - INPUT Element, of Type TEXT, found at Line: 183, Column: 110 contains a non-empty 'value' attribute. This is a practice referred to as "self-labeling." Self-Labeling is argued to be accessible under Priority One or Section 508 guidelines/standards. We recommend using a Label as the Preferred method or the use of an 'alt' attribute to make this element accessible.
    • Warning - INPUT Element, of Type TEXT, found at Line: 187, Column: 129 contains a non-empty 'value' attribute. This is a practice referred to as "self-labeling." Self-Labeling is argued to be accessible under Priority One or Section 508 guidelines/standards. We recommend using a Label as the Preferred method or the use of an 'alt' attribute to make this element accessible.
    • Warning - INPUT Element, of Type TEXT, found at Line: 187, Column: 234 contains a non-empty 'value' attribute. This is a practice referred to as "self-labeling." Self-Labeling is argued to be accessible under Priority One or Section 508 guidelines/standards. We recommend using a Label as the Preferred method or the use of an 'alt' attribute to make this element accessible.
    <snip>

    In the example, there is a label who's 'for' attribute is being set to '<%= RadDatePicker1.DateInput.ClientID + "_TextBox" %>'

    but there are two other inputs rendered for each datepicker that still violate the 508 1.1.2 rule.


    In my page, I tried adding the AssociatedControlId property on the label that precedes the control on the form, but I'm still receiving failures as well.

    Any suggestions?
  2. Rick Glos
    Rick Glos avatar
    2 posts
    Member since:
    Mar 2007

    Posted 25 Mar 2008 Link to this post

    I'd like to add that we've been able to reproduce this in a sandbox environment easily.

    Here's a simple page using the control:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RadDatePicker.aspx.cs" Inherits="WebApplication.RadDatePicker" %> 
     
    <%@ Register assembly="Telerik.Web.UI, Version=2007.3.1314.35, Culture=neutral, PublicKeyToken=121fae78165ba3d4" namespace="Telerik.Web.UI" tagprefix="telerik" %> 
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
     
    <html xmlns="http://www.w3.org/1999/xhtml" > 
    <head runat="server"
        <title>RadDatePicker Prometheus 1.1.2 INPUT element 508 Compliance Issues</title> 
    </head> 
    <body> 
        <form id="form1" runat="server"
         
            <h1>RadDatePicker Prometheus 1.1.2 INPUT element 508 Compliance Issues</h1> 
             
            <asp:scriptmanager runat="server"></asp:scriptmanager> 
             
            <asp:Label ID="uxLabelDate" runat="server" AssociatedControlID="RadDatePicker1" Text="Date:" /> 
            <telerik:RadDatePicker ID="RadDatePicker1" Runat="server"></telerik:RadDatePicker> 
             
        </form> 
    </body> 
    </html> 


    Here's the error:


    Rule: 1.1.2 - All INPUT elements are required to contain the alt attribute or use a LABEL.
    • Failure - INPUT Element, of Type TEXT, found at Line: 55, Column: 150
    • Failure - INPUT Element, of Type TEXT, found at Line: 55, Column: 238

    Here's the output lines:


      55: <TD class=inputCell style="WIDTH: 100%"><SPAN class=radInput_Default id=RadDatePicker1_dateInput_wrapper style="DISPLAY: block; WHITE-SPACE: nowrap"><INPUT class=radEnabledCss_Default id=RadDatePicker1_dateInput_text style="WIDTH: 100%"><INPUT id=RadDatePicker1_dateInput style="BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; FLOAT: right; VISIBILITY: hidden; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: -18px 0px 0px; OVERFLOW: hidden; WIDTH: 0px; PADDING-TOP: 0px; HEIGHT: 0px; BORDER-RIGHT-WIDTH: 0px" name=RadDatePicker1$dateInput><INPUT id=RadDatePicker1_dateInput_ClientState type=hidden name=RadDatePicker1_dateInput_ClientState></SPAN></TD>


    Thanks,
    Rick
  3. Plamen Peshev
    Admin
    Plamen Peshev avatar
    885 posts

    Posted 26 Mar 2008 Link to this post

    Hi Rick,


    Please find attached a sample web application that demonstrates how to workaround this issue. Let me know if you have other question and/or problems.

    Best wishes,
    Plamen
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
Back to Top