Question

我已经尝试了几种方法来使这个控件通过508合规性测试，但它们似乎都失败了。我没有得到测试人员的反馈，只是通过/失败。我怀疑是与在Radio Buttons周围自动呈现的表有关。我怀疑标签必须在表格内，这不是RadioButtonList的选项。以下是我尝试过但失败的方法。

Fieldset / legend解决方案

ASP / NET页面：

<fieldset>
<legend>Review By:</legend>
<asp:RadioButtonList runat="server" ID="FilterType" AutoPostBack="true" Width="100%"
       BorderWidth="1"   OnSelectedIndexChanged="FilterType_OnSelectedIndexChanged" />
</fieldset>

呈现HTML：

<fieldset>
<legend>Review By:</legend>
<table id="ctl00_contentBody_FilterType" border="0" style="border-width:1px;
border-style:solid;width:100%;">
        <tr>
<td><input id="ctl00_contentBody_FilterType_0" type="radio"
name="ctl00$contentBody$FilterType" value="1" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$0
\',\'\')',  0)" /><label for="ctl00_contentBody_FilterType_0">Attending MD</label>
</td>
        </tr><tr>
<td><input id="ctl00_contentBody_FilterType_1" type="radio"
name="ctl00$contentBody$FilterType" value="2" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$1
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_1">CERMe Review 
Types</label></td>
        </tr><tr>
<td><input id="ctl00_contentBody_FilterType_2" type="radio" 
name="ctl00$contentBody$FilterType" value="3" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$2
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_2">Treating 
Specialty</label></td>
        </tr><tr>
<td><input id="ctl00_contentBody_FilterType_3" type="radio" 
name="ctl00$contentBody$FilterType" value="4" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$3
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_3">Ward Location</label>
</td>
        </tr>
</table>
</fieldset>

使用AssociatedControlID将控件链接到标签

ASP.Net页面：

<asp:Label ID="lblHiddenReviewType"  AssociatedControlID="FilterType" runat="server">
<div>Review Type:</div></asp:Label> 
<asp:RadioButtonList runat="server" ID="FilterType" AutoPostBack="true" Width="100%"
BorderWidth="1" OnSelectedIndexChanged="FilterType_OnSelectedIndexChanged" />

呈现HTML：

<td>
            <label for="ctl00_contentBody_FilterType"  
id="ctl00_contentBody_lblHiddenReviewType"><div>Review Type:</div></label> 
                <table id="ctl00_contentBody_FilterType" border="0" style="border-
width:1px;border-style:solid;width:100%;">
        <tr>
            <td><input id="ctl00_contentBody_FilterType_0" 
type="radio" name="ctl00$contentBody$FilterType" value="1" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$0
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_0">Attending MD</label></td>
        </tr><tr>
            <td><input id="ctl00_contentBody_FilterType_1"   
type="radio" name="ctl00$contentBody$FilterType" value="2" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$1 
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_1">CERMe Review Type</label>
</td>
        </tr><tr>
            <td><input id="ctl00_contentBody_FilterType_2" 
type="radio" name="ctl00$contentBody$FilterType" value="3" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$2
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_2">Treating 
Specialty</label></td>
        </tr><tr>
            <td><input id="ctl00_contentBody_FilterType_3" 
type="radio" name="ctl00$contentBody$FilterType" value="4" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$3
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_3">Ward Location</label>
</td>
        </tr>
    </table>

            </td>

使用自己的面板围绕控件

ASP.Net页面：

<asp:Panel id="pnlRadial" GroupingText="Review Type: " runat="server">
<asp:RadioButtonList runat="server" ID="FilterType"  AutoPostBack="true" Width="100%"
 BorderWidth="1" OnSelectedIndexChanged="FilterType_OnSelectedIndexChanged" />
</asp:Panel>

呈现HTML：

<div id="ctl00_contentBody_pnlRadial">
<fieldset>
<legend>Review Type:</legend>
<table id="ctl00_contentBody_FilterType" border="0" style="border-width:1px;border-
style:solid;width:100%;">
                <tr>
<td><input id="ctl00_contentBody_FilterType_0" type="radio" 
name="ctl00$contentBody$FilterType" value="1" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$0
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_0">Attending MD</label></td>
                </tr><tr>
<td><input id="ctl00_contentBody_FilterType_1" type="radio" 
name="ctl00$contentBody$FilterType" value="2" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$1
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_1">Reviewer</label></td>
                </tr><tr>
<td><input id="ctl00_contentBody_FilterType_2" type="radio" 
name="ctl00$contentBody$FilterType" value="4" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$2
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_2">Treating 
Specialty</label></td>
                </tr><tr>
<td><input id="ctl00_contentBody_FilterType_3" type="radio" 
name="ctl00$contentBody$FilterType" value="5" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$3
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_3">Ward Location</label>
</td>
                </tr><tr>
<td><input id="ctl00_contentBody_FilterType_4" type="radio" 
name="ctl00$contentBody$FilterType" value="3" 
onclick="javascript:setTimeout('__doPostBack(\'ctl00$contentBody$FilterType$4
\',\'\')', 0)" /><label for="ctl00_contentBody_FilterType_4">Service Section</label>
</td>
                </tr>
</table>
</fieldset>
</div>

非常感谢任何帮助!!

Answer 1

我会要求测试人员提供比通过/失败更多的信息，至少他们用来测试的是什么。也许要求Section 508协调员参与其中可能会有所帮助。你的第一个或第二个片段应该通过。符合标准的解决方案如下：

<fieldset>
 <legend>Review type</legend>
 <table role="presentation"> //bonus for the role, not required
  <tr>
   <td>
    <input id="option1" name="myGroup" type="radio" />
   </td>
   <td>
    <label for="option1">Option 1</label>
   </td>
  </tr>
  <tr>
   <td>
    <input id="option2" name="myGroup" type="radio" />
   </td>
   <td>
    <label for="option2">Option 2</label>
   </td>
  </tr>
  ....
 </table>
</fieldset>

如何将Label与RadioButtonList控件关联以使其符合508标准？

1 个答案: