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

Provide a valid label for form fields

    Details

    • 12 status:
      Resolved
    • Previous Issue Keys:
      A11YTEST-242

      Description

      [New Issue] - 03/13/2018

      The "Participant Roles" radio buttons are no explicitly grouped with fieldset and legend elements. Same thing for the other groups of controls of the page:

      • Participant Status

      HTML:

      <h4>Participant Roles</h4>
      ...
      <table summary="" style="width:auto">
        <tbody>
          <tr>
            <td>      
              <input name="content::select-roles-selection" checked="checked" id="content::role-row:0:role-select" title="Select role type" value="sameRole" type="radio">
              <label for="content::role-row:0:role-select">Assign all participants to the same role</label>    
            </td>
          </tr>
          <tr>
            <td>      
              <input name="content::select-roles-selection" id="content::role-row:1:role-select" title="Select role type" value="differentRole" type="radio">      
              <label for="content::role-row:1:role-select">Assign each participant a role individually</label>    
             </td>
          </tr>
        </tbody>
      </table>

      Without proper grouping, a person using a screen reader might not be able to understand the relationship of the elements. Developers should:- utilize the fieldset element to group together related controls,- provide a legend,- provide a presentation role to the layout table or remove it.

      HTML:

      <fieldset>
        <legend>Participant Roles</legend>
        <input name="content::select-roles-selection" checked="checked" id="content::role-row:0:role-select" title="Select role type" value="sameRole" type="radio">    
        <label for="content::role-row:0:role-select">Assign all participants to the same role</label>    
          <br/>    
         <input name="content::select-roles-selection" id="content::role-row:1:role-select" title="Select role type" value="differentRole" type="radio">    
         <label for="content::role-row:1:role-select">Assign each participant a role individually</label>
      </fieldset>
      
      

        Gliffy Diagrams

          Attachments

            Activity

              People

              • Assignee:
                ottenhoff Sam Ottenhoff
                Reporter:
                jonespm Matthew Jones
              • Votes:
                0 Vote for this issue
                Watchers:
                1 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:

                  Git Source Code