Telerik:radpicker

[Thao]

Hello, I have a missing form label while running WAVES tool on telerik:RadDatePicker control.  I added DateInput-Label="hello" and it's clear the error but I do not want to see "hello" label.  I tried to add a class visuallyhidden but it's not working.  Is there any other way? Thank you.

<telerik:RadDatePicker ID="txtPlanEffectiveDate" runat="server" DateInput-DateFormat="MM/dd/yyyy"
Calendar-EnableAriaSupport="true" Calendar-EnableKeyboardNavigation="true">
</telerik:RadDatePicker>

[Rumen]

Hi Thao,

Thank you for sharing this accessibility scenario!

My advice is to set the RadDatePicker property EnableAriaSupport to true as well as the RenderMode to Lightweight:

<telerik:RadDatePicker EnableAriaSupport="true" ID="txtPlanEffectiveDate" runat="server" DateInput-DateFormat="MM/dd/yyyy" RenderMode="Lightweight"
            Calendar-EnableAriaSupport="true" Calendar-EnableKeyboardNavigation="true">
</telerik:RadDatePicker>

This did the trick for me.

Regards,
Rumen
Progress Telerik

[Thao]

Hello Rumen, I tried the code below like you said but I still have the same missing form label.  Please advise. Thank you.

<telerik:RadDatePicker EnableAriaSupport="true" ID="txtPlanEffectiveDate" runat="server" DateInput-DateFormat="MM/dd/yyyy" RenderMode="Lightweight"
                            Calendar-EnableAriaSupport="true" Calendar-EnableKeyboardNavigation="true">
                        </telerik:RadDatePicker>

[Rumen]

Hi Thao,

Can you please perform your test with the latest version 2019.2.514 (R2 2019)?

For your convenience I have recorded a demo video as well as attached my test project.

Am I missing something?

Regards,
Rumen
Progress Telerik

[Thao]

I just add jquery and it's clear now. Thank you for your help.

$('#ctl00_Main_content_txtPlanEffectiveDate_dateInput').attr('aria-labelledby', 'ctl00_Main_content_lbl_cntPlanEffectiveDate');

[Rumen]

You are welcome! 

Thank you for sharing your solution with the community. Keep up the good work.

Regards,
Rumen
Progress Telerik