1

I have an input tag that contains address. I need the screen reader to read the contents of the input digit by digit and not as whole number. For this I used aria-label and the screen reader is reading it fine. But the problem is that the screen reader after reading the address digit by digit also repeats the entire address as a whole number. I need to stop this whole number repetition of the address.

Any help would be appreciated.

I've tried 2 approaches:

Approach 1:

<input #input                 
             [type]="text"                 
             [attr.aria-label]="processAriaLabel()"
             [(ngModel)]="ariaLabel"/>

"processAriaLabel" is the method that converts the string: "12345 Von Karm" to "1 2 3 4 5 Von Karm" for the digits to be spoken separately.

In approach 1, the screen reader reads out the digits separately but also speaks the contents (numbers) as a whole number.

Approach 2:

<input #input             
             [type]="text"             
             [(ngModel)]="ariaLabel"
             [attr.aria-labelledby]="hiddenLabel"             
             [attr.aria-hidden]="true"/>

<label id="hiddenLabel" style="position: absolute; left: -9999px;">{{processAriaLabel()}}</label>

"processAriaLabel" is the method that converts the string: "12345 Von Karm" to "1 2 3 4 5 Von Karm" for the digits to be spoken separately.

In this approach, the screen reader doesn't read the number digit-by-digit at all. Only reads it as whole number.

user5957597
  • 71
  • 1
  • 8
  • Possible duplicate of questions already asked here: https://stackoverflow.com/questions/34090270/can-you-force-a-screen-reader-to-read-numbers-as-individual-digits and here https://stackoverflow.com/questions/21832888/telephone-numbers-and-screen-readers – Josh Dec 21 '17 at 21:42
  • 1
    This is not a duplicate question. I did refer to the 2 questions you've pointed out, but here's the rub: I am able to make the screen reader read the number digit-by-digit. But the screen reader reads both the aria-label and contents of input box. Resulting in reading the content twice :( – user5957597 Dec 22 '17 at 07:51
  • If the input will only contain numbers, you could try input type number or even tel and see if that makes a difference? – Fiona - myaccessible.website Dec 22 '17 at 09:44
  • I'm afraid that my input tag will contain an address. I cannot restrict it to numbers :( – user5957597 Dec 22 '17 at 10:15

0 Answers0