Making A CheckBox In GridView 508 Compliant

ISSUE
Since all HHS government websites need to be 508 compliant by May 2013, my company has been running around trying to make them compliant now. We have quite a few old applications which are still being used. It’s my job to review them for compliancy and fix some of them.

The issue I had was with a .NET application. On a search page they’re using a asp:GridView control which gets the results. One of the results is put into a check box (an asp:CheckBox). 508 says there should be a label tag or a title attribute associated with any input form field (even disabled ones):

<asp:GridView ID=”GridView1″ OnSorting=”GridView_Sorting” AutoGenerateColumns=”False” runat=”server” CellPadding=”4″ GridLines=”None” AllowSorting=”True”>
<Columns>
<asp:TemplateField HeaderText=”Attending”>
<ItemTemplate>
<asp:CheckBox ID=”Attending” Checked='<%# GetCheckValue(Container.DataItem) %>’ Enabled='<%# GetCheckEnable(Container.DataItem) %>’ runat=”Server” />
</ItemTemplate>

</asp:TemplateField>

</Columns>
</asp:GridView>

The problem is we need to make sure the check box has either a label or a title associated with it.

In .NET you’re allowed to add a ToolTip (title attribute) to asp check boxes. However it added it to a <span> which it generates outside the actual <input type=”checkbox”> code.

FIX
After a little while googling around I wasn’t able to find anything that would let me either get the ID (which it generates) so I can put a label next to it or actually have the title IN the check box.

A shot in the dark made it work. I had to add an attribute Text to the asp:CheckBox . This generates a label next to the check box in the client side code.

Since the application I’m working on doesn’t need to display anything next to it, I put the text in a .hide class which hides it.

Text=”<span class=’hide’>Attending</span>”

Some cons are that its label is the same everywhere. I’m sure some mad .NET developer can whip up something that can change it.

2 thoughts on “Making A CheckBox In GridView 508 Compliant


  1. Notice: Only variables should be assigned by reference in /home/niles38/longlivethemonkey.com/syntaxnotes/wp-content/plugins/subscribe-to-comments/subscribe-to-comments.php on line 590
    Taylor says:

    Anyone still looking for an easy answer to this can use something like aria-label=”Select this row” on the checkbox input tag.


  2. Notice: Only variables should be assigned by reference in /home/niles38/longlivethemonkey.com/syntaxnotes/wp-content/plugins/subscribe-to-comments/subscribe-to-comments.php on line 590
    aswini says:

    yes i’m facing the same issue by using below also the label is not working for input which has added for span only could you please yes
    Text=”Attending”


Deprecated: Function get_currentuserinfo is deprecated since version 4.5.0! Use wp_get_current_user() instead. in /home/niles38/longlivethemonkey.com/syntaxnotes/wp-includes/functions.php on line 6031

Leave a Reply

Your email address will not be published. Required fields are marked *