This is a migrated thread and some comments may be shown as answers.

Group panel

1 Answer 115 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Raymond
Top achievements
Rank 1
Raymond asked on 11 Oct 2016, 06:46 PM

The group panel for drag and drop grouping at the top of the grid contains nested tables.  See sample markup below.  Those tables contain empty TH elements which are not displayed (display=none), but still generate errors by our WAI accessibility checker tool.  Is there a property I can set that will set the text for those TH elements?  I've set the 3 offending TH elements in bold below.

 

Thanks,

 

Ray

 

 

<div id="ctl00_MasterHolder_rgdUsrReport_GroupPanel" style="width:100%;">
<table id="ctl00_MasterHolder_rgdUsrReport_GroupPanel_TB" class="rgGroupPanel" summary="The table which holds all grouping nested tables and is used as a wrapper." style="width:100%;border-spacing:0;border-collapse:separate;" role="presentation">
<caption>
MainTable
</caption><thead>
<tr style="display:none;">
<th scope="col"></th>
</tr>
</thead><tbody>
<tr>
<td><table summary="The nested grouping table which holds the group items table holding all grouped column items." style="width:100%;border-spacing:0;">
<caption>
Nested Grouping Table
</caption><thead>
<tr style="display:none;">
<th scope="col"></th>
</tr>
</thead><tbody>
<tr>
<td><table cellpadding="2" summary="The table holding all group items which are positioned in the group panel." style="border-style:None;width:100%;border-spacing:0;">
<caption>
Group Items Table
</caption><thead>
<tr style="display:none;">
<th scope="col"></th>
</tr>
</thead><tbody>
<tr>
<th scope="col" title="Drag out of the bar to ungroup" class="rgGroupItem" style="white-space: nowrap; cursor: move;">Data Collection Name&nbsp;<input type="button" name="ctl00$MasterHolder$rgdUsrReport$GroupPanel$ctl03" value=" " onclick="javascript:__doPostBack('ctl00$MasterHolder$rgdUsrReport$GroupPanel$ctl03','')" title="Sorted asc" class="rgSortAsc">&nbsp;<input type="button" name="ctl00$MasterHolder$rgdUsrReport$GroupPanel$ctl04" value=" " onclick="$find('ctl00_MasterHolder_rgdUsrReport').get_masterTableView()._ungroupByExpression('0:0'); return false;__doPostBack('ctl00$MasterHolder$rgdUsrReport$GroupPanel$ctl04','')" title="Click here to ungroup" class="rgUngroup"></th><td>-</td><th scope="col" title="Drag out of the bar to ungroup" class="rgGroupItem" style="white-space: nowrap; cursor: move;">Institution Name&nbsp;<input type="button" name="ctl00$MasterHolder$rgdUsrReport$GroupPanel$ctl06" value=" " onclick="javascript:__doPostBack('ctl00$MasterHolder$rgdUsrReport$GroupPanel$ctl06','')" title="Sorted asc" class="rgSortAsc">&nbsp;<input type="button" name="ctl00$MasterHolder$rgdUsrReport$GroupPanel$ctl07" value=" " onclick="$find('ctl00_MasterHolder_rgdUsrReport').get_masterTableView()._ungroupByExpression('0:1'); return false;__doPostBack('ctl00$MasterHolder$rgdUsrReport$GroupPanel$ctl07','')" title="Click here to ungroup" class="rgUngroup"></th><td style="width:100%;"></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table>
</div>

1 Answer, 1 is accepted

Sort by
0
Pavlina
Telerik team
answered on 14 Oct 2016, 07:38 PM
Hello,

To prevent the errors you received you can try setting the Caption property of the Grid MasterTableView as shown in the respective accessibility demo:
http://demos.telerik.com/aspnet-ajax/grid/examples/accessibility-and-internationalization/accessibility-compliance/defaultcs.aspx

This value will be also used for populating the empty <th> element. Give it a try and let me know in case you still encounter any problems.

Regards,
Pavlina
Telerik by Progress
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Tags
Grid
Asked by
Raymond
Top achievements
Rank 1
Answers by
Pavlina
Telerik team
Share this question
or