Forms should consistently have errors above the top-level heading

[Jono M]

If you submit a form with validation errors, most of the time a message comes up above the <h1> on that page warning you that there are errors. However a few pages do not have this feature and only have error messages beside the invalid inputs.
Consistency is important to users of screen readers, who may assume that a form has submitted correctly if the error message does not appear where they expect.

Affected pages
- Login
- Profile
- New journal
- New plan
- New task
- Create page
- Create collection
- Create/Edit group
- New forum
- New topic
- Add user
- Add users/groups by CSV
- Add institution
- Allowed iframe sources

Affects latest master

(WCAG Level A)

[Kristina Hoeppner (kris-hoeppner)]

For sighted people it can be useful to display the message not at the top of the screen because it could be overlooked very easily. Robert implemented bug #1248318 recently which allows the placement of a warning message directly in / under a pieform element so that it's easier to see where the issue is. This needs to be taken into consideration. ;-)

[Kristina Hoeppner (kris-hoeppner)]

From bug#1261242:

Currently, form errors are usually shown with a notification at the top of the page and specific errors beside each form element. For people using screen readers this is not optimal since the errors do not show up when tabbing through the page.
Either errors should be grouped in a list at the top of the page, or each explanation should be linked to the relevant input using aria-describedby.

Affects latest master (using Orca 3.4.2)

(WCAG Level A)

[Jono M (jonom)]

IMO the best solution would be to have a generic error message at the top of the page (eg. the existing one "There was an error with submitting this form. Please check the marked fields and try again.") and individual error messages linked using aria-describedby.
Using role="alert" will allow the top level error message to be read out on page load.

[Mahara Bot (dev-mahara)]

Patch for "master" branch: https://reviews.mahara.org/2980

[Mahara Bot (dev-mahara)]

Reviewed: https://reviews.mahara.org/2980
Committed: http://gitorious.org/mahara/mahara/commit/80375b1412f6ba021c85641edb849c1014fc0aa3
Submitter: Son Nguyen (<email address hidden>)
Branch: master

commit 80375b1412f6ba021c85641edb849c1014fc0aa3
Author: Jono Mingard <email address hidden>
Date: Tue Jan 28 15:00:49 2014 +1300

Added top-level form errors to complement specific ones (Bug #1262483)

Pieforms now adds a global error message if there are any validation errors
in a form, in addition to the messages beside each element. This is
modified from the existing jserrormessage

Change-Id: I15b9f4238ec3e5b1e6cb7fcff0514855565f0364
Signed-off-by: Jono Mingard <email address hidden>