mirror of
https://github.com/DSpace/dspace-angular.git
synced 2025-10-07 01:54:15 +00:00
Add the ability to expand / collapse via keyboard
This commit is contained in:
@@ -23,7 +23,7 @@
|
|||||||
(blur)="onBlur($event)"
|
(blur)="onBlur($event)"
|
||||||
(click)="$event.stopPropagation(); openDropdown(sdRef);"
|
(click)="$event.stopPropagation(); openDropdown(sdRef);"
|
||||||
(focus)="onFocus($event)"
|
(focus)="onFocus($event)"
|
||||||
(keypress)="$event.preventDefault()">
|
(keydown)="selectOnKeyDown($event, sdRef)">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div ngbDropdownMenu
|
<div ngbDropdownMenu
|
||||||
|
@@ -98,6 +98,23 @@ export class DsDynamicScrollableDropdownComponent extends DsDynamicVocabularyCom
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* KeyDown handler to allow toggling the dropdown via keyboard
|
||||||
|
* @param event KeyboardEvent
|
||||||
|
* @param sdRef The reference of the NgbDropdown.
|
||||||
|
*/
|
||||||
|
selectOnKeyDown(event: KeyboardEvent, sdRef: NgbDropdown) {
|
||||||
|
const keyName = event.key;
|
||||||
|
|
||||||
|
if (keyName === ' ' || keyName === 'Enter') {
|
||||||
|
event.preventDefault();
|
||||||
|
event.stopPropagation();
|
||||||
|
sdRef.toggle();
|
||||||
|
} else if (keyName === 'ArrowDown' || keyName === 'ArrowUp') {
|
||||||
|
this.openDropdown(sdRef);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Loads any new entries
|
* Loads any new entries
|
||||||
*/
|
*/
|
||||||
|
Reference in New Issue
Block a user