Outdated Content!
The Protocols and Formats Working Group is no longer chartered to operate. Its work will continue in two new Working Groups:
- https://www.w3.org/WAI/APA/ Accessible Platform Architectures, to review specifications, develop technical support materials, collaborate with other Working Groups on technology accessibility, and coordinate harmonized accessibility strategies within W3C; and
- https://www.w3.org/WAI/ARIA/ Accessible Rich Internet Applications, to continue development of the Accessible Rich Internet Applications (WAI-ARIA) suite of technologies and other technical specifications when needed to bridge known gaps.
Resources from the PFWG remain available to support long-term institutional memory, but this information is of historical value only.
This Wiki page was edited by participants of the Protocols and Formats Working Group. It does not necessarily represent consensus and it may have incorrect information or information that is not supported by other Working Group participants, WAI, or W3C. It may also have some very useful information.
Role/form
form
: A Proposed Predefined role
for the XHTML Role Module
Proposals
- PROPOSAL: Add a role value "form" to the vocabulary (Shane McCarron, 2009-04-29)
Related Issues & Proposals
- ARIA 1.0 Last Call Comment:
role="form"
missing (closest construct:role="search"
) (Gregory J. Rosmaita, 2009-04-08)
Examples
Use of role="form"
on a Hybrid Form
Background
The following is an example of the intended use of role="form"
, taken from Wikimedia's default "edit this page" template. Note that the Wikimedia form is a hybrid form -- while there are actual form controls, there are also form controls and javascripted input mechanisms that are NOT included in the form's tab order, and which do not appear in an assistive technology's list of form controls. This is problematic because the user reasonably expects the "Cancel" mechanism to be in the FORM
's tabindex
, but since the Wikimedia template closes the FORM
immediately after the "Summary" text input field, despite the use of FORM
controls outside of the FORM
block, such controls need to be programmatically bound to the actual FORM
controls through the use of the role="form"
.
Wikimedia Edit Page Hybrid Form with role="form"
Added to Include FORM
controls outside of the FORM
declaration
<div role="form"> <form id="editform" name="editform" method="post" action="/wiki/index.php?title=Fake&action=submit" enctype="multipart/form-data"> <input type='hidden' value="" name="wpSection" /> <input type='hidden' value="20090518162219" name="wpStarttime" /> <input type='hidden' value="20090518162219" name="wpEdittime" /> <input type='hidden' value="" name="wpScrolltop" id="wpScrolltop" /> <textarea tabindex='1' accesskey="," name="wpTextbox1" id="wpTextbox1" rows='25'cols='80' ></textarea> <div id="editpage-copywarn"> <p>Please note that all contributions to XHTML2 may be edited, altered, or removed by other contributors. If you don't want your writing to be edited mercilessly, then don't submit it here.<br /> You are also promising us that you wrote this yourself, or copied it from a public domain or similar free resource (see <a href="/wiki/index.php?title=Fake:Copyrights&action=edit" class="new" title="XHTML2:Copyrights">XHTML2:Copyrights</a> for details). <strong>DO NOT SUBMIT COPYRIGHTED WORK WITHOUT PERMISSION!</strong> </p> </div> <span id='wpSummaryLabel'><label for='wpSummary'>Summary:</label></span> <div class='editOptions'> <input tabindex='2' type='text' value="" name='wpSummary' id='wpSummary' maxlength='200' size='60' /><br /> <input name="wpMinoredit" type="checkbox" value="1" tabindex="3" accesskey="i" id="wpMinoredit" /> <label for='wpMinoredit' title="Mark this as a minor edit [i]" accesskey="i">This is a minor edit</label> <input name="wpWatchthis" type="checkbox" value="1" tabindex="4" accesskey="w" id="wpWatchthis" /> <label for='wpWatchthis' title="Add this page to your watchlist [w]" accesskey="w">Watch this page</label> <div class='editButtons'> <input id="wpSave" name="wpSave" type="submit" tabindex="5" value="Save page" accesskey="s" title="Save your changes [s]" /> <input id="wpPreview" name="wpPreview" type="submit" tabindex="6" value="Show preview" accesskey="p" title="Preview your changes, please use this before saving! [p]" /> <input id="wpDiff" name="wpDiff" type="submit" tabindex="7" value="Show changes" accesskey="v" title="Show which changes you made to the text. [v]" /> <span class='editHelp'><a href="/wiki/Fake" title="Fake">Cancel</a> | <a target="helpwindow" href="/MarkUp/xhtml2/wiki/Help:Editing">Editing help</a> (opens in new window)</span> </div> <!-- editButtons --> </div> <!-- editOptions --> <div class="mw-editTools"></div> <div class='templatesUsed'> </div> <input type='hidden' value="253f6a4e393d7f38931dbe2aa31bedf8+\" name="wpEditToken" /> <input name="wpAutoSummary" type="hidden" value="d41d8cd98f00b204e9800998ecf8427e" /> </form> <input name="wpMinoredit" type="checkbox" value="1" tabindex="3" accesskey="i" id="wpMinoredit" /> <label for='wpMinoredit' title="Mark this as a minor edit [i]" accesskey="i">This is a minor edit</label> <input name="wpWatchthis" type="checkbox" value="1" tabindex="4" accesskey="w" id="wpWatchthis" /> <label for='wpWatchthis' title="Add this page to your watchlist [w]" accesskey="w">Watch this page</label> <div class='editButtons'> <input id="wpSave" name="wpSave" type="submit" tabindex="5" value="Save page" accesskey="s" title="Save your changes [s]" /> <input id="wpPreview" name="wpPreview" type="submit" tabindex="6" value="Show preview" accesskey="p" title="Preview your changes, please use this before saving! [p]" /> <input id="wpDiff" name="wpDiff" type="submit" tabindex="7" value="Show changes" accesskey="v" title="Show which changes you made to the text. [v]" /> <span class='editHelp'><a href="/wiki/Fake" title="Fake">Cancel</a> | <a target="helpwindow" href="/wiki/Help:Editing">Editing help</a> (opens in new window)</span> </div> <!-- the next /div closes the DIV marked with a role of 'form' --> </div>