Accessibility Guide for Siebel Business Applications > Using Accessibility Features > Customizing Accessibility Features >

Updating the List Applet Table

This topic describes the changes that you must make if you create a new .swt file and new list applets. The list applets are displayed as HTML tables in standard-interactivity plus mode applications. In the current implementation of the list applet, summary attribute, row, and column identifiers are missing by default. It is difficult for users with disabilities to identify and understand the functionality of the list applet without a summary attribute. To help users to identify the list applet cell, you set the row and column identifiers.

Data Table Summary

You can provide an overview for a list applet table by adding an extra attribute, named summary, to the <table> element. The HTML <table> tags are used in .swt files. The place holder for the summary tag must be added in the .swt file for all the list applets as follows:

<table valign="top" width="100%" cellpadding="2" cellspacing="1" border="0" summary="swe:this.ListSummary">

The following sample code shows the HTML <table> element with the summary attribute:

<TABLE class="GridBack" cellSpacing="0" cellPadding="0" border="0" summary="<overview of the table>">

<TR>

<TD></TD>

<TD></TD>

</TR>

</TABLE>

Data Table Cells

You can associate row and column header identifiers with each cell in the list applet by adding an extra attribute scope = "col" to column header and scope = "row" to row header. The <th> and <td> elements for the <table> elements are in the .swt files.

Add the scope attribute for the column header to the .swt file as follows:

<th align="swe:this.TextAlignment" width="swe:this.HtmlWidth" class="Header" scope="col" abbr="swe:this.HeaderAbbr">

Add the scope attribute for the row header to the .swt file as follows:

<td align="swe:this.TextAlignment" class="Row" scope="swe:this.RowScope">

The list applet row IDs are not available in the preconfigured application, but you can add one if you want. For more information about the list applet IDs, see Setting Row IDs for List Applets.

The following sample code shows the HTML <td> and <th> element with the scope attribute:

<TABLE class="GridBack" cellSpacing="0" cellPadding="0" border="0" summary="<overview of the table>">

<tr>

<th scope="col">Name</th>

<th scope="col">Phone#</th>

<th scope="col">Fax#</th>

<th scope="col">City</th>

</tr>

<tr>

<td scope="row">Joel Garner</td>

<td>412-212-5421</td>

<td>412-212-5400</td>

<td>Pittsburgh</td>

</tr>

<tr>

<td scope="row">Clive Lloyd</td>

<td>410-306-1420</td>

<td>410-306-5400</td>

<td>Baltimore</td>

</tr>

</TABLE>

Data Table Headers

You can add short descriptions about the column header by adding an abbr attribute to the <th> element. The abbr attribute shows the exact column header. Using the abbr attribute, you disable the short link in the list applet column header. The <th> elements for the <table> elements are in the .swt files.

Add the abbr attribute to the .swt file for all the list applet column headers as follows:

<th align="swe:this.TextAlignment" width="swe:this.HtmlWidth" class="Header" scope="col" abbr="swe:this.HeaderAbbr">

The following sample code shows the HTML <th> element with the abbr attribute:

<TABLE class="GridBack" cellSpacing="0" cellPadding="0" border="0" summary="<overview of the table>">

<tr>

<th scope="col" abbr="Name">Name xyz</th>

<th scope="col" abbr="Phone#">Phone# xyz</th>

<th scope="col" abbr="Fax#">Fax# xyz</th>

<th scope="col" abbr="City">City xyz</th>

</tr>

<tr>

<td scope="row">Joel Garner</td>

<td>412-212-5421</td>

<td>412-212-5400</td>

<td>Pittsburgh</td>

</tr>

</TABLE>

Layout Tables

The layout tables are used to display data other than list applets. In the HTML source code, there is no difference between data tables (list applets) and layout tables.

You can differentiate a data table (list applet) from a layout table by adding two extra attributes (summary="" and datatable="0") to the HTML <table> element.

The following sample code shows the HTML <table> element with the summary="" and datatable="0" attributes:

<TABLE class="GridBack" cellSpacing="0" cellPadding="0" border="0" datatable="0" summary="">

<TR>

<TD></TD>

<TD></TD>

</TR>

</TABLE>

The layout tables added in the .swt files must have the summary="" and datatable="0" attributes.