Uploaded image for project: 'Sakai'
  1. Sakai
  2. SAK-38403

Provide a valid label for form fields

    Details

    • Previous Issue Keys:
      A11YTEST-229

      Description

      [New] - 3/13/2018

      [Issue]

      The Calendar buttons have no valid label.The screen reader announces: "Unlabeled 2 button on mouse over".

      [User Impact]Users of screen readers may miss the purpose of these buttons.

      [Code]

      HTML:

      <button type="button" class="ui-datepicker-trigger">    
        <span class="fa fa-calendar" aria-hidden="true"></span>
      </button>

      [Expected behavior]

      Developers must explicitly label form fields.Developers should add an aria-label property.

      [Compliant code]

      HTML:

      <button type="button" class="ui-datepicker-trigger" aria-label="Start Time: open calendar">    
        <span class="fa fa-calendar" aria-hidden="true"></span>
      </button>

        Gliffy Diagrams

          Attachments

            Issue Links

              Activity

                People

                • Assignee:
                  steve.swinsburg Steve Swinsburg
                  Reporter:
                  jonespm Matthew Jones
                • Votes:
                  0 Vote for this issue
                  Watchers:
                  3 Start watching this issue

                  Dates

                  • Created:
                    Updated:

                    Git Source Code