WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Form validation - on submit or on each required field

for

From: Paul J. Adam
Date: Jun 26, 2014 12:22PM

It's always best to send focus directly to the errors so the screen reader does not go silent on a bad submit and assume the form is broken.

If you're doing a page reload you could still send focus to them with JavaScript .focus(), make sure the errors are programmatically associated with the invalid inputs also so they hear them when TABing.

If the invalid input has an associated error message you could also use HTML5 autofocus to grab it on page reload.



Paul J. Adam
Accessibility Evangelist
www.deque.com

On Jun 26, 2014, at 12:18 PM, Stanzel, Susan - FSA, Kansas City, MO < <EMAIL REMOVED> > wrote:

> When the errors are returned at the top of the page are they supposed to be read automatically? I am coding JSP with the use of struts. I work at the United States Department of Agriculture.
>
> Susie Stanzel
>
> -----Original Message-----
> From: <EMAIL REMOVED> [mailto: <EMAIL REMOVED> ] On Behalf Of Rick Hill
> Sent: Thursday, June 26, 2014 12:14 PM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] Form validation - on submit or on each required field
>
> You always need to validate on server side. Using only client-side validation opens you up to evil clients who can fiddle with your input information. Client-side is basically an add-on with added benefits, but server-side is a must.
> -------------------------------------------------------------------
> Rick Hill, Web CMS Administrator
> Strategic Communications, UC Davis
>
>
> From: <Clark>, "<Michelle - NRCS>", <Washington>, DC < <EMAIL REMOVED> <mailto: <EMAIL REMOVED> >>
> Reply-To: WebAIM Discussion List < <EMAIL REMOVED> <mailto: <EMAIL REMOVED> >>
> Date: Thursday, June 26, 2014 at 7:36 AM
> To: WebAIM Discussion List < <EMAIL REMOVED> <mailto: <EMAIL REMOVED> >>
> Subject: Re: [WebAIM] Form validation - on submit or on each required field
>
> My preference is to validate at the time of inputting the information. That way, once a user gets to the end, the form is correct and can be submitted.
>
> Michelle
>
> -----Original Message-----
> From: <EMAIL REMOVED> <mailto: <EMAIL REMOVED> > [mailto: <EMAIL REMOVED> ] On Behalf Of Liko, Todd
> Sent: Thursday, June 26, 2014 10:06 AM
> To: ' <EMAIL REMOVED> <mailto:' <EMAIL REMOVED> >'
> Subject: [WebAIM] Form validation - on submit or on each required field
>
> Hello all.
>
> I am seeking your thoughts on which type of form validation is preferred. A form with required fields (with proper notifications) can be validated server side when submitting the form or each field can be validated while completing the form.
>
> With validation on submit, if there are errors, the form is refreshed with the focus returning to the top of the form where the errors are listed. When validating each field while completing the form, the user is notified of the error right away and focus is returned to the field.
>
> In my opinion, both methods meet WCAG 2.0. However, keeping usability in mind, is there a preference to which method is used.
>
> _______
> Todd Liko
> Communications Advisor | Conseiller en communications Web Services | Services Web Communications and Marketing | Communications et Marketing
> 427 Laurier Avenue West (AEAD), Ottawa ON K1A 0N5
> 427 Avenue Laurier Ouest (AEAD), Ottawa (Ontario) K1A 0N5 e-mail / courriel: <EMAIL REMOVED> <mailto: <EMAIL REMOVED> ><mailto: <EMAIL REMOVED> >
> telephone / téléphone: 613-949-9425 | fax / télécopieur: 613-949-2386
> blackberry: 613-796-6375
> Government of Canada | Gouvernement du Canada
>
> > >
>
>
>
> This electronic message contains information generated by the USDA solely for the intended recipients. Any unauthorized interception of this message or the use or disclosure of the information it contains may violate the law and subject the violator to civil or criminal penalties. If you believe you have received this message in error, please notify the sender and delete the email immediately.
> > >
> > > > >