WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: adding of three numbers still not working

for

From: Lynn Holdsworth
Date: Jan 15, 2015 6:57AM

Hi Suzie,

Try this. It's a bit draconian as it uses the ALERT role, but it seems
to work in the AT/browser combo you're using.

Your ARIA label wasn't working, so I removed it and added the word
"Sum" to the text node that gets created at the end, and applied the
ALERT role to that node's container.

It still needs a bit of work to make it behave just how you want it
to, but it kind of works.



http://behindtheyellowline.org.uk/addNumbersAlert.html

... And here's a polite version:

http://behindtheyellowline.org.uk/addNumbersPolite.html

Cheers, Lynn

On 15/01/2015, Stanzel, Susan - FSA, Kansas City, MO
< <EMAIL REMOVED> > wrote:
> Hi Listers,
>
> Birkir and some other people have helped some, but this is still not
> working. It actually works much better in FireFox. I have JAWS 15 IE 9 with
> Windows7. Any help would be greatly appreciated.
>
> Susie
>
> Here is the source:
>
> <!DOCTYPE html>
> <html>
> <head>
> <title>Output test</title>
> </head>
> <body>
> <form method="post" action="#">
> <label for="input1Id">Input 1:</label>
> <input id="input1Id" aria-controls="outputId"
> type="text">
> <br>
> <label for="input2Id">Input 2:</label>
> <input id="input2Id" type="text"
> aria-controls="outputId" >
> <br>
> <label for="input3Id">Input 3:</label>
> <input id="input3Id" type="text"
> aria-controls="outputId">
> <hr>
> <div aria-live="polite" aria-atomic="true"
> role="region"
> aria-labelledby="Result">
>
> <span id="sumLabel">Sum: </span>
> <span id="outputId" >
> </span>
> </div>
> </form>
> <script type="text/javascript">
> var inputIds = ["input1Id", "input2Id", "input3Id"];
> function handleBlur()
> {
> var output =
> document.getElementById("outputId");
> var sum = 0;
> for (var i = 0; i < inputIds.length; i++)
> {
> var inputId = inputIds[i];
> var input =
> document.getElementById(inputId);
> var value = parseInt(input.value, 10);
> if (! isNaN(value))
> {
> sum += value;
> }
> }
> output.removeChild(output.firstChild);
> var text = document.createTextNode(sum);
> output.appendChild(text);
> }
>
>
>
> var inputs = document.getElementsByTagName("input");
> for (var i = 0; i < inputs.length; i++)
> {
> inputs[i].addEventListener("blur", handleBlur);
>
> }
> document.getElementById("input1Id").focus();
> </script>
> </html>
>
>
>
>
>
>
> 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.
> > > >