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

Provide a valid label for form fields

    Details

    • 19 status:
      Verified
    • 12 status:
      Please Merge
    • Previous Issue Keys:
      A11YTEST-241

      Description

      [New Issue] - 03/13/2018

      The description below each checkbox is not explicitly linked to it.

      HTML:

      <input name="selectedTools" value="home" id="sakai.home" checked="checked" type="checkbox">
      <label for="sakai.home" style="font-weight: bold;">    Overview</label>...
      <div class="toolListDesc textPanelFooter specialLink">   
         For viewing description of the site. May include recent announcements, discussion, and chat items.
      </div>

      Users of screen readers may miss the description when navigating between the different checkboxes.Developers must explicitly label form fields.

      Developers should:- Provide each description a unique id,

      • Link the checkbox to it with an aria-describedby
      <input name="selectedTools" value="home" id="sakai.home" checked="checked" type="checkbox" aria-describedby="sakai.home.desc">
      <label for="sakai.home" style="font-weight: bold;">    Overview</label>...
      <div id="sakai.home.desc" class="toolListDesc textPanelFooter specialLink">    For viewing description of the site. May include recent announcements, discussion, and chat items.
      </div>

        Gliffy Diagrams

          Attachments

            Activity

              People

              • Assignee:
                kedwar1 Kendra Edwards
                Reporter:
                jonespm Matthew Jones
              • Votes:
                0 Vote for this issue
                Watchers:
                2 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:

                  Git Source Code