EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: xarn on February 21, 2017, 03:50:40 AM



Title: [Solved] tree drag drop + keyboard navigation
Post by: xarn on February 21, 2017, 03:50:40 AM
Hi,

I successfully added keyboard navigation on a tree using a slight variation of the code snippet found here:
http://www.jeasyui.com/forum/index.php?topic=5167.0

The way you listen to keyboard events on a tree was:

Code:
mytree.attr('tabindex', 1).bind('keydown', function (e) {...});

This worked fine ...until DND was enabled on the tree. Afterwards, the event handler isn't even called. Does anyone know how to do it properly?

I also got exactly the same problem with the datagrid. Without DND key events work fine, once enabled it doesn't trigger anymore. ...it would be really nice if there was a proper way to add key bindings.


Title: Re: tree drag drop + keyboard navigation
Post by: jarry on February 21, 2017, 07:42:33 PM
The tree must get focus before getting input from the keyboard. Please try this:
Code:
mytree.attr('tabindex', 1).focus().bind('keydown', function (e) {...});


Title: Re: tree drag drop + keyboard navigation
Post by: xarn on February 22, 2017, 12:21:51 AM
Thanks Jarry,

the focus did the trick. I had to place it in the onClick of the tree though, since it would get lost once you click elsewhere.


Code:
onClick: function(e) {
$(this).focus();
}