This page is out of date, we cannot guarantee the accuracy of the content.

Mozilla Accessible Spreedsheet and ZK Accessible Grid:

Content last updated: 31 August 2007

In Mozilla accesibility project, there is a well-implemented spreadsheet to demostrate how to implement a gird with a table. In ZK, we use divs and tables to implement a grid instead of a simple table. In the following, how ZK Accessible Grid is implemented will be illustrated by comparing to the grid sample from Mozilla.

Mozilla DHTML Spreadsheet Demo

http://www.mozilla.org/access/dhtml/spreadsheet

In the above figure, a HTML is used to implement the grid. By following the WAI-ARIA guildlines, "wairole:grid" is assigned to the table tag. And "wairole:columnheader" is assigned to the th in theader. "wairole:rowheader" is assigned to the first td tag in tr tag. "wairole:gridcell" is assigned to the rest of td tags in tr tag.

ZK Accessible Grid

In ZK grid, the grid is represented by 3 divs and 2 tables. It lookes like this:

<div> div for whole grid
	<div> div for grid header
		<table /> table for grid header
	</div>
	<div> div for grid body
		<table /> table for grd body
	</div>ss
</div>

By following the WAI-ARIA guildlines, "wairole:grid" is assigned to the outter Div. And "wairole:columnheader" is assigned to the th in theader of grid header table. "wairole:rowheader" is assigned to the first td tag in tr tag. "wairole:gridcell" is assigned to the rest of td tags in tr tag. Both of them are belonged to the grid body table.

Notice: Since ZK grid is generic and there is no way for grid automatically know which td in grid body table should be the "rowheader" semantically. Therefore,  the setRowheaderIndex method in the object Rows should be used. See the sample code below:

<waiRows rowheaderIndex="0"> --indicating that the rowheader role should be applied to the td at index 0.
	<waiRow>
		<label value="File:" />
		<textbox width="99%" />
	</waiRow>
<waiRow>

	
If "-1" is assigned, no td will be applied as "rowheader." In other words, all tds are applied gridcell role