I'm using version 2022.2.622.45.
If the checkboxes are displayed in the RadComboBox, the NVAD cannot read out the actual items in the combo box, and only give out the sound 'blank'.
Maybe there's special key for the navigation?
NVDA cannot read out the items in RadComboBox when checkboxes are displayed
0 Answers
65 Views
Hi Sheng,
Could you please try enabling the EnableAriaSupport property of the Combo and also make sure that the interactable part of the page has its role set to 'application'. Here is a basic code to test:
<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head runat="server"> <title>Title</title> </head> <body> <form id="form1" runat="server" role="application"> <asp:ScriptManager runat="server" ID="ScriptManager1" /> <h1>Header</h1> <telerik:RadComboBox ID="RadComboBox1" runat="server" RenderMode="Lightweight" EnableAriaSupport="true" CheckBoxes="true" AriaSettings-Label="MyCombo"> <KeyboardNavigationSettings CommandKey="Alt" FocusKey="M" /> <Items> <telerik:RadComboBoxItem Text="Item 1" /> <telerik:RadComboBoxItem Text="Item 2" /> <telerik:RadComboBoxItem Text="Item 3" /> <telerik:RadComboBoxItem Text="Item 4" /> </Items> </telerik:RadComboBox> </form> </body> </html>Hello Sheng,
I tested the provided code snippet Doncho gave and on my end, everything was working as intended - the NVDA screen reader read the items in the combo box, even with the version you're using.
Please make sure the role="application" attribute to the <form> and EnableAriaSupport="true" for the combo box, because they are essential. If these 2 properties don't work, we'll investigate the issue, but for that, we'll need an isolated sample project with the combo box and all the relevant code related to it.
I look forward to hearing from you.
Kind regards,
Vasko
Progress Telerik
Hi Vasko,
I tested your suggestion by adding role="application".
It's working if adding role="application" to the <form> element. But why it isn't working when adding role="application" to a parent <div> element?
According to the guide (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/application_role), the application role should be added to the lowest common container possible. The <form> element is a widely containing element. I don't think it is a good solution to use <form> element.
Regards,
Sheng
Hello Sheng,
Thank you for the response.
I conducted a test with the same ComboBox configuration given in the initial reply, but this time with a parent div element with the role property set to application, and on my end it works as expected.
I've attached a video that demonstrates the test, as well as the sample code used in it:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> <Scripts> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> </Scripts> </telerik:RadScriptManager> <div role="application"> <telerik:RadComboBox ID="RadComboBox1" runat="server" RenderMode="Lightweight" EnableAriaSupport="true" CheckBoxes="true" AriaSettings-Label="MyCombo"> <KeyboardNavigationSettings CommandKey="Alt" FocusKey="M" /> <Items> <telerik:RadComboBoxItem Text="Item 1" /> <telerik:RadComboBoxItem Text="Item 2" /> <telerik:RadComboBoxItem Text="Item 3" /> <telerik:RadComboBoxItem Text="Item 4" /> </Items> </telerik:RadComboBox> </div> </form> </body> </html>Kind regards,
Vasko
Progress Telerik
Thanks Vasko for the new code and video.
I tried your new code but the the issue is the same for me. When setting role="application" at <div>, when navigating use keyboard only, I can select the first item in the dropdown list, but couldn't select the rest. If setting role="application" at <form>, there's no such issue.
I watched your video, it seems you had the same issue, not being able to move between the items using keyboard only.
Sheng
Hi Sheng,
It looks like this is an NVDA bug, since after upgrading it to its latest version, the application role issue went away.
Can you please upgrade NVDA to its latest version? This resolved the selection problem on my end.
Hello Sheng,
There is a possibility that we talking about different things.
I suggest that you submit a support ticket and share the complete implementation of the Combobox so we can test that. In addition, please also describe the exact problem that you experience. We need to understand what is your expectation and what is happening right now.
Once we find the answer/solution to the issue, we will share it in this forum to make it available to the community.
Kind regards,
Vasko
Progress Telerik