Resolving the WCAG Error in the DNN Events Module for the Current Day Input Box

Overview

 

The Web Content Accessibility Guidelines (WCAG) 2.0 rule 1.1.1 states that the input fields must have associated text labels and rule 3.3.2 details instructions related to input assistance. However, the current date input box in version 07.00.06 of the DNN Events module does not have an associated label.

This article describes the process of resolving this issue.

 


Process

 

The DNN Community now manages the DNN Events module. To resolve the issue, you must add a script in the Header section of the page by following the steps mentioned below:

  1. Navigate to: Page Settings > Advanced > S.E.O.

    2020-03-02_0923.png

  2. Add the following code to the Page Header Tags section of the page:

    <script>
    $(function() {
      $(".ModDNNEventsC .EvtHdrMdlCol .riTextBox").attr("title","selected date");
    });
    </script>

 

Confirmation

 

The script will add the title attribute with the value selected date as soon as the document is done loading.

 

Back to Top


Additional Information

 

As a workaround, use Wave to view the error details in the left panel, select the input element with the missing attribute, and then insert the missing attribute by using JavaScript (as shown in the image below). 

2020-01-23_16-28-37.jpg

Note: While performing the workaround will resolve the error, there will still be a warning for the missing label, and this would be best handled with a code update by the DNN Community.

 

If you find any other errors, you must submit the issue(s) to the DNN Community.

 

Back to Top

Comments

0 comments

Please sign in to leave a comment.