ICI Keyboard Shortcuts[edit]


= ICI Keyboard Shortcuts =

== Home/Edit Dashboard ==
<div class="image-green-border">[[File:ICI Keyboard Shortcuts.PNG|720px|ICI Keyboard Shortcuts.PNG]]</div> <div class="image-green-border">&nbsp;</div> 
'''Keyboard Shortcuts'''

{| border="1" cellpadding="1" cellspacing="1" style="width: 500px;"
|-
| '''Keyboard Shortcut'''
| '''Description'''
|-
| '''ALT+W'''
| Enable the widget mode and select one widget.
|-
| '''?'''
| Focus on the next widget.
|-
| '''?'''
| Focus on the previous widget.
|-
| '''CTRL+Right Arrow'''
| Increase the width of the widget.
|-
| '''CTRL+Left Arrow'''
| Decrease the width of the widget.
|}

*'''ALT+W''': Enable the widget edit mode and select one widget.&nbsp; 
*'''?'''&nbsp;: Focus on the next widget.&nbsp; 
*'''?&nbsp;''': Focus on the previous widget. 
*'''CTRL+ Right Arrow''': Increase the width of the widget.&nbsp; 
*'''CTRL+ Left Arrow''': Decrease the width of the widget.&nbsp; 
<div class="image-green-border">&nbsp;</div> 
== Entity Index Page ==
<div class="image-green-border">[[File:ICI Keyboard Shortcuts2.PNG|720px|ICI Keyboard Shortcuts2.PNG]]</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">
{| border="1" cellpadding="1" cellspacing="1" style="width: 500px;"
|-
| '''Keyboard Shortcuts'''
| '''Description'''
|-
| '''Alt+W'''
| Focuses on the entity table.
|-
| colspan="2" | '''Actions applied on Grid Header'''
|-
| '''Enter'''
| Sort the column.
|-
| '''?&nbsp;'''
| Wrap or clip the text in the column.
|-
| '''CTRL+Left Arrow'''
| Reorders the column with the previous one.
|-
| '''CTRL+Right Arrow'''
| Reorders the column with the next one.
|-
| colspan="2" | '''Actions&nbsp;''''''applied on Grid data table'''
|-
| Arrow keys&nbsp;
| Navigate the table cells.
|-
| '''CTRL+Home'''
| Focuses the first focusable cells inside the table.
|-
| '''CTRL+End'''
| Focuses the last focusable cell in the last row.
|-
| '''Home'''
| Focuses the first focusable cell in the row.
|-
| '''End'''
| Focuses the last focusable cell in the row.
|-
| colspan="2" | '''Actions applied on Grid Page'''
|-
| '''Page Up'''
| Navigate to the previous page.
|-
| '''Page Down'''
| Navigate to the next page.
|}

These shortcuts are applicable and available for the below entities on the agreement "Details" page.
</div> 
*Agreement 
*Contract Request 
*Associations 
*Compliances 
*Templates 
*Clauses 
*Select User drawer 
*Lookup tables&nbsp; 
*Users 
*Organization Groups&nbsp; 
*User Groups&nbsp; 
*Security Groups 
*Associations 

== Index pages&nbsp; ==
<div class="image-green-border">[[File:ICI Keyboard Shortcuts4.PNG|720px|ICI Keyboard Shortcuts4.PNG]]</div> <div class="image-green-border">&nbsp;</div> 
'''Keyboard Shortcuts'''

{| border="1" cellpadding="1" cellspacing="1" style="width: 500px;"
|-
| '''Keyboard Shortcut'''
| '''Description'''
|-
| '''Alt+W'''
| Focuses on the entity table.
|-
| colspan="2" | '''Actions applied on the Grid header'''
|-
| '''Enter'''
| Sorts the column.
|-
| '''CTRL+Left Arrow'''
| Reorders the column with the previous one.
|-
| '''CTRL+Right Arrow'''
| Reorders the column with the next one.
|-
| '''Alt+Down'''
| Opens the filter menu.
|-
| '''Esc'''
| Closes the filter menu.
|-
| colspan="2" | '''Actions applied on Grid Data table'''
|-
| '''Arrow Keys'''
| Navigate the table cells.
|-
| '''CTRL+Home'''
| Focuses the first focusable cell inside the table.
|-
| '''CTRL+End'''
| Focuses the last focusable cell in the last row.
|-
| '''Home'''
| Focuses the first focusable cell in the row.
|-
| '''End'''
| Focuses the last focusable cell in the row.
|-
| colspan="2" | '''Actions applied on Grid page'''
|-
| '''Page Up'''
| Navigate to the previous page.
|-
| '''Page Down'''
| Navigate to the next page.
|}

These shortcuts are applicable and available for below pages

*Dashboard configuration 
*Bulk Actions 
*User Tasks 
*Category List 
*&nbsp;Subscription List 
*&nbsp;History table for different entities 
*&nbsp;Version table for different entities 
*Team table for different entities.&nbsp; 

== Input Controls Dropdown ==

[[File:ICI Keyboard Shortcuts6.PNG|400px|ICI Keyboard Shortcuts6.PNG]]

&nbsp;

'''Keyboard Shortcuts'''

{| border="1" cellpadding="1" cellspacing="1" style="width: 500px;"
|-
| '''Keyboard Shortcuts'''
| '''Description'''
|-
| '''Up Arrow'''
| Highlights the previous item.
|-
| '''Down Arrow'''
| Highlights the next item.
|-
| '''Home'''
| Selects the first item in the list.
|-
| '''End'''
| Selects the last item in the list.
|-
| '''Page Up'''
| Scrolls the popup up.
|-
| '''Page Down'''
| Scrolls the popup down.
|-
| '''Enter'''
| Selects the highlighted item.
|-
| '''Esc'''
| Closes the popup.
|-
| '''Alt +Down Arrow'''
| Opens the popup.
|-
| '''Alt+ Up Arrow'''
| Closes the popup.
|}

These shortcuts are applicable for all the Kendo dropdowns in the application, these shortcuts will work when the focus is on the dropdown.

&nbsp;

== Input Controls- Numeric textbox&nbsp; ==
<div class="image-green-border">[[File:ICI Keyboard Shortcuts8.PNG|720px|ICI Keyboard Shortcuts8.PNG]]</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">
{| border="1" cellpadding="1" cellspacing="1" style="width: 500px;"
|-
| '''Keyboard Shortcut'''
| '''Description'''
|-
| '''Up Arrow'''
| Increases the widget's value by 1.
|-
| '''Down Arrow'''
| Decreases the widget value by 1.
|}

These shortcuts are applicable for all the Kendo numeric textboxes in the application, these shortcuts will work when the focus is on the numeric text box.

&nbsp;
</div> 
== Date Picker ==
<div class="image-green-border">[[File:ICI Keyboard Shortcuts10.PNG|720px|ICI Keyboard Shortcuts10.PNG]]</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">
{| border="1" cellpadding="1" cellspacing="1" style="width: 500px;"
|-
| '''Keyboard Shortcuts'''
| '''Description'''
|-
| colspan="2" | '''When the date popup is closed.'''
|-
| '''Enter'''
| Triggers the change event.
|-
| '''Alt+Down'''
| Opens the date popup.
|-
| '''Alt+Up'''
| Closes the date popup.
|-
| colspan="2" | '''When the date popup is opened'''
|-
| '''Left Arrow'''
| Highlights the previous day.
|-
| '''Right Arrow'''
| Highlights the next day.
|-
| '''Up Arrow'''
| Highlights the same day from the previous week.
|-
| '''Down Arrow'''
| Highlights the same day from the next week.
|-
| '''CTRL + Left Arrow'''&nbsp;&nbsp;
| &nbsp; Navigates to previous month.
|-
| '''CTRL+Right Arrow'''
| Navigates to the next month.
|-
| '''CTRL+Up Arrow'''
| Navigates to&nbsp; the previous view.
|-
| '''CTRL+Down Arrow'''
| Navigates to the next view.
|-
| '''Home'''
| Highlights first day of the month.
|-
| '''End'''
| Highlights the last day of the month.
|-
| '''Enter'''
| Selects the highlighted day in "month" view . Navigates to a lower viewIn other views
|}

&nbsp;
</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">These shortcuts are applicable for all the Kendo date pickers in the application, these shortcuts will work when the focus is on the date picker.</div> 
== Date Time Picker&nbsp; ==
<div class="image-green-border">[[File:ICI Keyboard Shortcuts12.PNG|720px|ICI Keyboard Shortcuts12.PNG]]</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">
{| border="1" cellpadding="1" cellspacing="1" style="width: 500px;"
|-
| '''Keyboard Shortcuts'''
| '''Description'''
|-
| colspan="2" | '''When the date popup is closed.'''
|-
| '''Enter'''
| Triggers the change event.
|-
| '''Alt+Down'''
| Opens the date popup.
|-
| '''Alt+Up'''
| Closes the date popup.
|-
| colspan="2" | '''When the date popup is opened'''
|-
| Left Arrow
| Highlights the previous day.
|-
| Right Arrow
| Highlights the next day.
|-
| Up Arrow
| Highlights the same day from the previous week.
|-
| Down Arrow
| Highlights the same day from the next week.
|-
| CTRL+Left Arrow
| Navigates to the previous month.
|-
| CTRL+Right Arrow
| Navigates to the next month.
|-
| CTRL+Up Arrow
| Navigates to the previous view.
|-
| CTRL+Down Arrow
| Navigates to the next view.
|-
| Home
| Highlights the first day of the month.
|-
| End
| Highlights the last day of the month.
|-
| Enter
| Selects the highlighted day&nbsp;in "month" view. Navigates to a lower view&nbsp;In other views.
|-
| colspan="2" | '''When the time popup is opened'''
|-
| Up Arrow
| Selects the previous available time.
|-
| Down Arrow
| Selects the next available time.
|}

&nbsp;
</div> <div class="image-green-border">These shortcuts are applicable for all the Kendo Date Time Picker in the application, these shortcuts will work when the focus is on the Time and Date picker.</div> <div class="image-green-border">&nbsp;</div> 
== Rich Text Area ==
<div class="image-green-border">[[File:ICI Keyboard Shortcuts14.PNG|720px|ICI Keyboard Shortcuts14.PNG]]</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">[[File:ICI Keyboard Shortcuts15.PNG|450px|ICI Keyboard Shortcuts15.PNG]]</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">These shortcuts are applicable for all the Kendo Rich Text Editor in the application, these shortcuts will work when the focus is on the Rich Text Editor.</div> <div class="image-green-border">&nbsp;</div> 
== Multi Select ==
<div class="image-green-border">[[File:ICI Keyboard Shortcuts16.PNG|720px|ICI Keyboard Shortcuts16.PNG]]</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">[[File:ICI Keyboard Shortcuts17.PNG|450px|ICI Keyboard Shortcuts17.PNG]]</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">These shortcuts are applicable for all the Kendo Multi Select in the application, these shortcuts will work when the focus is on the Multi Select control.</div> <div class="image-green-border">&nbsp;</div> 
== Attribute Page ==
<div class="image-green-border">&nbsp;[[File:ICI Keyboard Shortcuts18.PNG|720px|ICI Keyboard Shortcuts18.PNG]]</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">[[File:ICI Keyboard Shortcuts19.PNG|450px|ICI Keyboard Shortcuts19.PNG]]</div> <div class="image-green-border">&nbsp;</div> <div class="image-green-border">These shortcuts are applicable for attribute page in configuration or while in contract type creation.</div>