inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added Tabbing to datatable and keyboard functionality (#2262)

Browse Source
This commit is contained in:
tdonovancsra
2017-08-31 09:47:25 -04:00
committed by Denys Vuika
parent 7cc107781a
commit c05c882330
1 changed files with 14 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html
View File

@@ -18,7 +18,11 @@
[attr.data-automation-id]="'auto_id_' + col.key" [attr.data-automation-id]="'auto_id_' + col.key"
[class.adf-data-table__header--sorted-asc]="isColumnSorted(col, 'asc')" [class.adf-data-table__header--sorted-asc]="isColumnSorted(col, 'asc')"
[class.adf-data-table__header--sorted-desc]="isColumnSorted(col, 'desc')" [class.adf-data-table__header--sorted-desc]="isColumnSorted(col, 'desc')"
(click)="onColumnHeaderClick(col)"> (click)="onColumnHeaderClick(col)"
(keyup.enter)="onColumnHeaderClick(col)"
role="button"
tabindex="0"
title="{{col.title}}">
<span *ngIf="col.srTitle" class="sr-only">{{col.srTitle}}</span> <span *ngIf="col.srTitle" class="sr-only">{{col.srTitle}}</span>
<span *ngIf="col.title">{{ col.title | translate}}</span> <span *ngIf="col.title">{{ col.title | translate}}</span>
</th> </th>
@@ -31,11 +35,15 @@
<tbody> <tbody>
<ng-container *ngIf="!loading"> <ng-container *ngIf="!loading">
<tr *ngFor="let row of data.getRows(); let idx = index" tabindex="0" <tr *ngFor="let row of data.getRows(); let idx = index"
[class.is-selected]="row.isSelected" [class.is-selected]="row.isSelected"
[adf-upload]="allowDropFiles && rowAllowsDrop(row)" [adf-upload-data]="row" [adf-upload]="allowDropFiles && rowAllowsDrop(row)" [adf-upload-data]="row"
[ngStyle]="rowStyle" [ngStyle]="rowStyle"
[ngClass]="getRowStyle(row)"> [ngClass]="getRowStyle(row)"
(click)="onRowClick(row, $event)"
(keyup.enter)="onRowClick(row, $event)"
tabindex="0"
role="button">
<!-- Actions (left) --> <!-- Actions (left) -->
<td *ngIf="actions && actionsPosition === 'left'"> <td *ngIf="actions && actionsPosition === 'left'">
@@ -64,7 +72,8 @@
class="adf-data-table-cell adf-data-table-cell--{{col.type || 'text'}} {{col.cssClass}}" class="adf-data-table-cell adf-data-table-cell--{{col.type || 'text'}} {{col.cssClass}}"
(click)="onRowClick(row, $event)" (click)="onRowClick(row, $event)"
[context-menu]="getContextMenuActions(row, col)" [context-menu]="getContextMenuActions(row, col)"
[context-menu-enabled]="contextMenu"> [context-menu-enabled]="contextMenu"
tabindex="0">
<div *ngIf="!col.template" class="cell-container"> <div *ngIf="!col.template" class="cell-container">
<ng-container [ngSwitch]="col.type"> <ng-container [ngSwitch]="col.type">
<div *ngSwitchCase="'image'" class="cell-value"> <div *ngSwitchCase="'image'" class="cell-value">