LP1849212: accessible labels in the course page
authorJane Sandberg <sandbej@linnbenton.edu>
Fri, 14 Aug 2020 19:22:03 +0000 (12:22 -0700)
committerJane Sandberg <sandbej@linnbenton.edu>
Fri, 14 Aug 2020 20:16:37 +0000 (13:16 -0700)
Signed-off-by: Jane Sandberg <sandbej@linnbenton.edu>
Open-ILS/src/eg2/src/app/staff/admin/local/course-reserves/course-associate-material.component.html
Open-ILS/src/eg2/src/app/staff/admin/local/course-reserves/course-associate-users.component.html

index 02baf10..2c994fc 100644 (file)
                 <div class="d-flex" [ngClass]="isDialog() ? 'col-md-6' : 'col-md-12'">
                   <div class="input-group">
                     <div class="input-group-prepend">
-                      <span class="input-group-text" i18n>Barcode</span>
+                      <label for="associate-item-barcode" class="input-group-text" i18n>Barcode</label>
                     </div>
-                    <input type="text" class="flex-grow-1" [(ngModel)]="barcodeInput" (click)="$event.target.select()"
+                    <input type="text" class="flex-grow-1" id="associate-item-barcode"
+                      [(ngModel)]="barcodeInput" (click)="$event.target.select()"
                       [disabled]="currentCourse && currentCourse.is_archived() == 't'"
                       (keyup.enter)="associateItem(barcodeInput, relationshipInput)" />
                   </div>
                   <div class="input-group">
                     <div class="input-group-prepend">
                       <div class="input-group-text">
-                        <span i18n>Call Number</span>
+                        <label for="associate-item-temp-call-number" i18n>Call Number</label>
                       </div>
                     </div>
-                    <input type="text" [(ngModel)]="tempCallNumber"
+                    <input type="text" [(ngModel)]="tempCallNumber" label="associate-item-temp-call-number"
                       [disabled]="currentCourse && currentCourse.is_archived() == 't'"
                       (input)="isModifyingCallNumber = true" class="flex-grow-1" />
                     <div class="input-group-append">
index a0969bf..aaf5f6b 100644 (file)
         <div class="d-flex"  [ngClass]="isDialog() ? 'col-md-6' : 'col-md-12'">
           <div class="input-group">
             <div class="input-group-prepend">
-              <span class="input-group-text" i18n>Patron Barcode</span>
+              <label for="associate-user-barcode" class="input-group-text" i18n>Patron Barcode</label>
             </div>
-            <input type="text" class="flex-grow-1" [(ngModel)]="userBarcode"
-              (click)="$event.target.select()" 
+            <input type="text" class="flex-grow-1" id="associate-user-barcode"
+              [(ngModel)]="userBarcode" (click)="$event.target.select()"
               [disabled]="currentCourse && currentCourse.is_archived() == 't'"
               (keyup.enter)="associateUser(userBarcode)" />
           </div>
@@ -34,9 +34,9 @@
         <div class="d-flex" [ngClass]="isDialog() ? 'col-md-6' : 'col-md-12 mt-3'">
           <div class="input-group">
             <div class="input-group-prepend">
-              <span class="input-group-text" i18n>Role</span>
+              <label for="associate-user-role" class="input-group-text" i18n>Role</label>
             </div>
-            <input type="text" [(ngModel)]="userRoleInput"
+            <input type="text" [(ngModel)]="userRoleInput" id="associate-user-role"
               [disabled]="currentCourse && currentCourse.is_archived() == 't'"
               placeholder-i18n placeholder="e.g. Student, TA, Instructor..."
               class="flex-grow-1" />
           <div class="input-group">
             <div class="input-group-prepend">
               <div class="input-group-text">
-                <span i18n>Is Public Role?</span>
+                <label for="associate-user-public" i18n>Is Public Role?</label>
               </div>
             </div>
             <div class="input-group-append">
               <div class="input-group-text">
-                <input type="checkbox" [(ngModel)]="isPublicRole"
+                <input type="checkbox" [(ngModel)]="isPublicRole" id="associate-user-public"
                   [disabled]="currentCourse && currentCourse.is_archived() == 't'"
                   aria-label="Checkbox for allowing user to display on the OPAC Course Page" />
               </div>
@@ -70,7 +70,7 @@
       </div>
     </div>
     <div class="mt-3" [ngClass]="isDialog() ? 'col-md-12' : 'col-md-8'">
-      <eg-grid #usersGrid [dataSource]="usersDataSource">
+      <eg-grid #usersGrid [dataSource]="usersDataSource" [useLocalSort]="true">
         <eg-grid-toolbar-action label="Remove Selected" i18n-label (onClick)="deleteSelectedUsers($event)">
         </eg-grid-toolbar-action>
         <eg-grid-toolbar-action label="Edit Selected" i18n-label (onClick)="editSelectedUsers($event)">
   [fieldOptions]="{course: {linkedSearchField: 'course_number'}}"
   [preloadLinkedValues]="true"
   hiddenFields="id,usr">
-</eg-fm-record-editor>
\ No newline at end of file
+</eg-fm-record-editor>