scope and 508 compliance
scope and 508 compliance
canopus
Posts: 7Questions: 0Answers: 0
Hey All,
I was hoping for some advice on adding scope = "col" to my table column headers. I already changed the first cell of my rows to a and added scope = 'row' using another post here, but I also need to add scope = "col" to my column headers. Is there a way to add it to my aoColumns definitions?
Here's my code. BTW, I am passing a list of table data through to datatables to generate the table, so there is no HTML in the template (where I'd normally add my scope.)
[code]
$(document).ready(function() {
$('#rules').html( '' );
$('#rules_table').dataTable( {
"bProcessing": true,
"bAutoWidth":false,
"bDeferRender": true,
"aaSorting": [],
"aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
"aoColumnDefs": [{ "sType": "html", "aTargets": [ 0 ] },
{"aTargets": [ 0 ], "sCellType": "th", "fnCreatedCell": function ( cell ) { cell.scope = 'row'; }},
{ "bVisible": false, "aTargets": [ 4 ] }],
"sDom": '<"group_head"ip<"clear">><"clear">W<"clear"T>lrt<"group_head"ip<"clear">>',
"oTableTools": {
"sSwfPath": "/apps/tools/ruleorganizer/static/js/DataTables-master/extras/TableTools/media/swf/copy_csv_xls_pdf.swf",
"aButtons": [ "xls" ]},
"oColumnFilterWidgets": {"aiExclude": [0,1,8,9,10], "sSeparator": "\\s*,+\\s*"},
"aaData": rule_list,
"aoColumns": [
{ "sTitle": "ID", "sClass": "rules_table_md"},
{ "sTitle": "Description", "sClass": "rules_table_lg"},
{ "sTitle": "Category", "sClass": "rules_table_lg" },
{ "sTitle": "Applicability", "sClass": "rules_table_lg" },
{ "sTitle": "Type", "sClass": "rules_table_sm"},
{ "sTitle": "Status", "sClass": "rules_table_md" },
{ "sTitle": "Rule Creator", "sClass": "rules_table_md" },
{ "sTitle": "Rule Steward", "sClass": "rules_table_md" },
{ "sTitle": "Date Created/Rev.", "sClass": "rules_table_md" },
{ "sTitle": "Comments", "sClass": "rules_table_lg" },
{ "sTitle": "Technical Comments", "sClass": "rules_table_lg" }
]
} );
} );[/code]
I was hoping for some advice on adding scope = "col" to my table column headers. I already changed the first cell of my rows to a and added scope = 'row' using another post here, but I also need to add scope = "col" to my column headers. Is there a way to add it to my aoColumns definitions?
Here's my code. BTW, I am passing a list of table data through to datatables to generate the table, so there is no HTML in the template (where I'd normally add my scope.)
[code]
$(document).ready(function() {
$('#rules').html( '' );
$('#rules_table').dataTable( {
"bProcessing": true,
"bAutoWidth":false,
"bDeferRender": true,
"aaSorting": [],
"aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
"aoColumnDefs": [{ "sType": "html", "aTargets": [ 0 ] },
{"aTargets": [ 0 ], "sCellType": "th", "fnCreatedCell": function ( cell ) { cell.scope = 'row'; }},
{ "bVisible": false, "aTargets": [ 4 ] }],
"sDom": '<"group_head"ip<"clear">><"clear">W<"clear"T>lrt<"group_head"ip<"clear">>',
"oTableTools": {
"sSwfPath": "/apps/tools/ruleorganizer/static/js/DataTables-master/extras/TableTools/media/swf/copy_csv_xls_pdf.swf",
"aButtons": [ "xls" ]},
"oColumnFilterWidgets": {"aiExclude": [0,1,8,9,10], "sSeparator": "\\s*,+\\s*"},
"aaData": rule_list,
"aoColumns": [
{ "sTitle": "ID", "sClass": "rules_table_md"},
{ "sTitle": "Description", "sClass": "rules_table_lg"},
{ "sTitle": "Category", "sClass": "rules_table_lg" },
{ "sTitle": "Applicability", "sClass": "rules_table_lg" },
{ "sTitle": "Type", "sClass": "rules_table_sm"},
{ "sTitle": "Status", "sClass": "rules_table_md" },
{ "sTitle": "Rule Creator", "sClass": "rules_table_md" },
{ "sTitle": "Rule Steward", "sClass": "rules_table_md" },
{ "sTitle": "Date Created/Rev.", "sClass": "rules_table_md" },
{ "sTitle": "Comments", "sClass": "rules_table_lg" },
{ "sTitle": "Technical Comments", "sClass": "rules_table_lg" }
]
} );
} );[/code]
This discussion has been closed.
Replies
No - you'd do it with a bit of jQuery after you've initialised the table:
[code]
table.$('tr td:eq(0)').attr('scope', 'row');
[/code]
or similar.
The other option is to use the fnRowCreated or fnCellCreated callbacks and manipulate the DOM at that point.
Allan
Thanks would it work the same way for columns, like
[code]
table.$('tr td:eq(0)').attr('scope', 'col');
[/code]
?
Thanks!
Allan