WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: JAWS reading disabled radio button state incorrectly

for

Number of posts in this thread: 3 (In chronological order)

From: Mark Magennis
Date: Fri, Sep 15 2017 7:43AM
Subject: JAWS reading disabled radio button state incorrectly
No previous message | Next message →

Hi everyone,

I'm looking at a radio button set that is not working as expected with JAWS. When I select a radio button, all radio buttons become disabled by scripting. If I then navigate through them with the arrow keys, JAWS does not announce the checked state of the selected radio button correctly. Any idea why?


<fieldset>
<legend>List of Answers</legend>
<input name="group" id="one" onchange="change()" type="radio">
<label id="labelOne" for="one">First</label>
<input name="group" id="two" onchange="change()" type="radio">
<label id="labelTwo" for="two">Second</label>
<input name="group" id="three" onchange="change()" type="radio">
<label id="labelThree" for="three">Third</label>
</fieldset>

<script>
function change() {
$("#one").attr("disabled", "disabled").attr("aria-disabled", "true");
$("#two").attr("disabled", "disabled").attr("aria-disabled", "true");
$("#three").attr("disabled", "disabled").attr("aria-disabled", "true");
}
</script>


Thanks,
Mark

From: JP Jamous
Date: Fri, Sep 15 2017 8:13AM
Subject: Re: JAWS reading disabled radio button state incorrectly
← Previous message | Next message →

Looking at this real quickly, I noticed that the radio buttons are missing the Name attribute. Add one and see if that makes a difference.

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Mark Magennis
Sent: Friday, September 15, 2017 8:44 AM
To: Webaim Forum < = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] JAWS reading disabled radio button state incorrectly

Hi everyone,

I'm looking at a radio button set that is not working as expected with JAWS. When I select a radio button, all radio buttons become disabled by scripting. If I then navigate through them with the arrow keys, JAWS does not announce the checked state of the selected radio button correctly. Any idea why?


<fieldset>
<legend>List of Answers</legend>
<input name="group" id="one" onchange="change()" type="radio">
<label id="labelOne" for="one">First</label>
<input name="group" id="two" onchange="change()" type="radio">
<label id="labelTwo" for="two">Second</label>
<input name="group" id="three" onchange="change()" type="radio">
<label id="labelThree" for="three">Third</label>
</fieldset>

<script>
function change() {
$("#one").attr("disabled", "disabled").attr("aria-disabled", "true");
$("#two").attr("disabled", "disabled").attr("aria-disabled", "true");
$("#three").attr("disabled", "disabled").attr("aria-disabled", "true"); } </script>


Thanks,
Mark
---
This email has been checked for viruses by AVG.
http://www.avg.com

From: Birkir R. Gunnarsson
Date: Fri, Sep 15 2017 8:32AM
Subject: Re: JAWS reading disabled radio button state incorrectly
← Previous message | No next message

If you add a disabled attribute to a radio button in a set, the radio
button should not be navigable with the keyboard.
So, by disabling all radio buttons in a set (except the one that is
selected) you are technically prevent the user from being able to
select any other radio button in the set.
Maybe Jaws is overriding this to ensure the user has access to other
radio buttons, or at least the design looks problematic to me (at a
glance).


On 9/15/17, JP Jamous < = EMAIL ADDRESS REMOVED = > wrote:
> Looking at this real quickly, I noticed that the radio buttons are missing
> the Name attribute. Add one and see if that makes a difference.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf
> Of Mark Magennis
> Sent: Friday, September 15, 2017 8:44 AM
> To: Webaim Forum < = EMAIL ADDRESS REMOVED = >
> Subject: [WebAIM] JAWS reading disabled radio button state incorrectly
>
> Hi everyone,
>
> I'm looking at a radio button set that is not working as expected with JAWS.
> When I select a radio button, all radio buttons become disabled by
> scripting. If I then navigate through them with the arrow keys, JAWS does
> not announce the checked state of the selected radio button correctly. Any
> idea why?
>
>
> <fieldset>
> <legend>List of Answers</legend>
> <input name="group" id="one" onchange="change()" type="radio">
> <label id="labelOne" for="one">First</label>
> <input name="group" id="two" onchange="change()" type="radio">
> <label id="labelTwo" for="two">Second</label>
> <input name="group" id="three" onchange="change()"
> type="radio">
> <label id="labelThree" for="three">Third</label>
>
> </fieldset>
>
> <script>
> function change() {
> $("#one").attr("disabled", "disabled").attr("aria-disabled",
> "true");
> $("#two").attr("disabled", "disabled").attr("aria-disabled",
> "true");
> $("#three").attr("disabled", "disabled").attr("aria-disabled",
> "true"); } </script>
>
>
> Thanks,
> Mark
> > > http://webaim.org/discussion/archives
> >
>
> ---
> This email has been checked for viruses by AVG.
> http://www.avg.com
>
> > > > >


--
Work hard. Have fun. Make history.