Any idea on what keyboard shortcuts to use to access tablesorter controls in column header? or software handlers/other to support 508 compliance (to support accessing these controls via the keyboard)?
Asked
Active
Viewed 856 times
2
-
Sorry, I didn't know about 508 compliance, so I have to ask... how would you interact with a table using the keyboard if there is no way to "focus" on it. This would be necessary if there were multiple tables on a page. I would be happy to work on something on my fork of tablesorter if I had some direction. – Mottie Mar 15 '12 at 19:28
2 Answers
2
<script type="text/javascript">
$(document).ready(function() {
<%--Applies the jQuery tablesorter plugin to any table with the class "addTableSorter"--%>
<%--Also enables tabbing to and pressing enter on the headers to sort for 508 compliance--%>
$('table.addTableSorter')
.tablesorter()
.find('th')
.keypress(function(e) {
if (e.which == 13) { //code for enter key
e.preventDefault();
$(this).trigger('click'); //simulate a click
}
})
.attr('tabindex', '0');
});
</script>

Michael J. Barber
- 24,518
- 9
- 68
- 88

user1186233
- 157
- 1
- 1
- 11
0
For this, I would definitely go with a pre-existing library. There are some nuances to accessible tables that can eat up time, and can be hard to test for if you don't have experience with a screen reader.
My favorite, when it comes pretty tables, is YUI 3:
http://yuilibrary.com/yui/docs/datatable/
Their library is solid, and their documentation is fantastic. Just make sure to follow their examples to get the full benefits. You can take an accessible library and make an inaccessible site quite easily.

kcunning
- 297
- 1
- 4
-
Since the time of this answer, development on YUI has been discontinued. https://yahooeng.tumblr.com/post/96098168666/important-announcement-regarding-yui – John Hascall Nov 19 '16 at 04:08