Hotkey Events - enter, shift+navigation, delete, (ctrl+A), (Shift+F10 / CONTEXT MENU BUTTON)

Webix JS
1

Hi,

I need to implement hotkey events such as enter, shift+navigation keys, delete on datatable row(s).
I tried with navigation:true on datatable which is working fine for one row. But I need to select one or more rows by using shit with navigation keys.

In the same way I need to implement delete event, context menu as well on datatable rows.

Please find the reference below:
http://webix.com/snippet/ae621aaa

Please help on this scenario’s. Appreciate for quick response.
Thanks in advance.

2

By default, datatable has a limited support of shift-selection

Check
http://webix.com/snippet/262f155d

It is the same sample with multiselection enabled. You can use shift-up, shift-down to select few rows.

As for any other hotkeys, you can use addHotKey API to add custom hotkeys

http://docs.webix.com/api__uimanager_addhotkey.html

http://docs.webix.com/desktop__uimanager.html#keyboardseventsandhotkeys

3

Thanks for your response.
I need help on context menu. I’m able to get the context menu by using onContext attribute (http://webix.com/snippet/52307495).
But I need to show the same context menu by using Shift+F10 key Or select key from keyboard.

Please provide the solution for this scenario.

Thanks in advance.

4

Webix registration number is 2560086:

I need help on context menu. I’m able to get the context menu by using mouse (http://webix.com/snippet/52307495). But I need to show the same context menu by using Shift+F10 key Or select key from keyboard.

Please provide the solution for this scenario.

5

Hi, do you need to show a context menu for the whole grid or attach it to a specific item?

The thing is that Webix context menu receives context object than contains information of an item that has been right-clicked from the event.

So the safest way to attach a context menu to a grid item is to simulate a right click event.

If you don’t need to attach a context menu for an item, you can just use show() method.

Check the snippet, please: http://webix.com/snippet/3553f93a

6

Webix registration number is 2560086:

Thanks Maksim for quick response.
Is it must to select firstId of context menu? Because when I comment the below code the navigation is not responding.
$$(“cmenu”).select($$(“cmenu”).getFirstId());

7

Webix registration number is 2560086:

Thanks Helga,

This logic is working fine in case I selected single item from the list.
Perhaps I’m selecting multiple items from the list then I’m getting the error (“Uncaught TypeError: Cannot read property ‘ownerDocument’ of undefined”).

But it is working as expected in case of mouse right click.

Check the snippet, please:http://webix.com/snippet/b1c5a8fd

8

You can use a bit different code to get first selected item and show the context menu next to it

http://webix.com/snippet/7fd57fa5

If in context menu handler you will need a full list of selected items, you can use datatable’s API to fetch them.

9

Thanks Maksim.

10

Webix registration number is 2560086:

I checked this snippet it is showing the context menu, But If I add navigation :true attribute to context menu view it is not working.

In context menu I have to navigate using navigation keys (up/down/left/right).

11

Navigation affects the position of selected item.
By default, menu control doesn’t have selection

Check the updated snippet
http://webix.com/snippet/d3a5404e

I have enabled the selection in the context menu.

12

Yes, when navigation is enabled, a hotkey can move the selection in the component. When we have no selection, it can’t be moved, so component doesn’t react on hotkeys.

I think we can update this behavior, and allow to select the first record in case of “bottom” key and the last record in case of “top” key. I will add it in TODO list for next Webix build.

13

Webix registration number is 2560086:

Thanks for your information Maksim. In this case navigation works from keyboard.

In case of sub-menu in the context menu navigation is not responding as expected.

If I click right navigation key on context menu option which has sub-menu it is not opening the sub-menu.

Please check the snippet: http://webix.com/snippet/b1a64b11

14

This type of keyboard action is not supported by built-in keyboard navigation.