Как связать метку с элементом управления RadioButtonList, чтобы он соответствовал стандарту 508?

Я испробовал несколько методов, чтобы этот элемент управления прошел проверку на соответствие 508, но все они, похоже, терпят неудачу. Я не получаю обратной связи от тестировщика, только зачет/незачет. Я подозреваю, что это связано с таблицей, которая автоматически отображается вокруг переключателей. Я подозреваю, что метки должны быть внутри таблицы, что невозможно с RadioButtonList. Вот методы, которые я пробовал и потерпел неудачу.

Набор полей/легенда Решение

Страница 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>

Любая помощь будет принята с благодарностью!


section508 radiobuttonlist
person pmcs    schedule 15.03.2013    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Я бы попросил тестировщика предоставить больше информации, чем пройдено/не пройдено, по крайней мере, то, что они используют для тестирования. Возможно, кому-то поможет обращение к координатору Раздела 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>
person Ryan B    schedule 20.03.2013
comment
Спасибо за ваш ответ. Вот проблема, это решение HTML. ASP RadioButtonList помещает переключатели в HTML-таблицу, которую нелегко изменить. Я вижу некоторые другие решения, в которых они пытаются изменить атрибуты при загрузке страницы, но я все еще не совсем уверен, как это реализовать. - person pmcs; 25.03.2013
comment
В наши дни большинство программ чтения с экрана могут видеть это, если таблица используется для макета или содержит данные. При добавлении role="presentation" в программу чтения с экрана теги таблицы удаляются. См. dvcs.w3.org/hg/aria-unofficial /raw-file/tip/index.html - person Ryan B; 25.03.2013