JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.
Add required field asterisk to address field sub-label (so it can be interpreted by assistive software)Asked by Joe on September 19, 2014 at 01:26 PM
Hi, we're a state government agency considering JotForm. I have some accessibility/usability questions for you. We're subject to the federal law and these guidelines:
§ 1194.22 Web-based intranet and internet information and applications
"(n) When electronic forms are designed to be completed on-line, the form shall allow people using assistive technology to access the information, field elements, and functionality required for completion and submission of the form, including all directions and cues."
1) When you insert a group of fields using the quick tools (like for address), the html output doesn't allow for assistive technology, like a screen reader, to know that those fields are required. The asterisk placed on the Address * label doesn't get read in forms mode. It does however read "Street Address", so maybe you can remove the asterisk from "Address *" and place it on the labels for each input, since those are what is required and those labels actually do get read?Relatedly, there's an accessibility error reported for the "Address" label because of its "for" attribute. The receiving input doesn't exist, and shouldn't since each input has separate labels for the "for" attribute that do work. You can eliminate those errors by removing that attribute on the main label.und would be to avoid using your quick tools and create each input separately.
Our workaro2) An even bigger problem is... when you get to the bottom of a multi-page form and hit the Next button with validation errors, nothing happens for assistive technology. I'm using the JAWS screen reader. The premium way this is done is by placing the focus into the first errant input and changing the label to "Enter required field: Street Address" or something similar. All of the errant labels on the page would be changed to that format, so the user can quickly tab through and catch the errant data input. (A simpler method is to pop an alert that says "Street address is required" then change focus to that field.)
Is it possible to address #2 above, and if so, how long would it take to make it happen?
I've split your thread so they can be individually addressed:
Regarding the asterisk situation I forwarded a feature request so it can be added to the quick tools address field's sublabel, as you mention the sublabel is detected by assistive software.
Our developers will contact you via this thread once they have an update on this.
The asterisk request applies to all of the quick tools that include sublabels, not just the address fields. Basically, if an input has a sublabel, the tool's main label should not have a "for" attribute.
You should probably use the fieldset element to group them and put the main label, like Address, inside the legend tag.
Your additional information about the request has been noted and forwarded along with the feature request my colleague has made. We will update you in this thread as soon as we have any further information as to the status of your request.