Feature Request: Keyboard Navigation "Tab"

[duckwilliamson]

I have no idea even where to begin with this, or I'd implement a potential patch. It would be very useful if, maybe using the Keyboard Mixin, we could hit Tab and go to the next cell for editing. Has anyone considered this before? Is it possible?

[kurtinatlanta]

Yes, it's possible.

On Aug 27, 2012, at 23:28, duckwilliamson [email protected] wrote:

I have no idea even where to begin with this, or I'd implement a potential patch. It would be very useful if, maybe using the Keyboard Mixin, we could hit Tab and go to the next cell for editing. Has anyone considered this before? Is it possible?

—
Reply to this email directly or view it on GitHub.

[phated]

Using dgrid 0.3.6, this worked for me: set your editOn value to 'dgrid-cellfocusin' and then bind keydown on the grid, as such

on(grid, 'keydown', function(e){
    if(e.keyCode === keys.TAB){
      Keyboard.moveFocusRight.call(grid, e);
    }
});

[kfranqueiro]

Indeed; you could also potentially do something like:

grid.addKeyHandler(keys.TAB, Keyboard.moveFocusRight);

This works since handlers registered via addKeyHandler are always executed in the context of the instance, and are passed the event. Though I'd point out that also registering shift+tab to move left would take more work (and might run into shenanigans when combined with Selection since it'd think you're highlighting a range).

[oracast-benhaigh]

Hmm I get an error Keyboard.moveFocusRight is not defined?

[kfranqueiro]

Are you working with dgrid 0.3.6? As noted by @phated, that's when this was added.

[frabe]

Is it also possible to have the

Keyboard.moveFocusLeft

on a key-combination like SHIFT+TAB (for Excel style navigation) ?

[kfranqueiro]

As I mentioned in my previous response, that should be feasible, though it'd require more work since you'd need to actually write a function to call Keyboard.moveFocusLeft or Keyboard.moveFocusRight depending on whether event.shiftKey is true, and if you're using the Selection mixin, you may need to work around the fact that it will assume that shift held during a dgrid-cellfocusin event means to select a range.

[phated]

It seems grid.addKeyHandler(keys.TAB, Keyboard.moveFocusRight); doesn't work on an editable cell while editing, else I am doing something wrong. If that is the case, I will have to stick with my example.

[stdavis]

@phated: Your example worked well for me using and editable cell. Thanks!

It also easily supports the SHIFT+TAB request by @frabe with a minor mod:

on(this.grid, 'keydown', function (e) {
    if (e.keyCode === keys.TAB) {
        if (!e.shiftKey) {
            Keyboard.moveFocusRight.call(that.grid, e);
        } else {
            Keyboard.moveFocusLeft.call(that.grid, e);
        }
    }
});

@duckwilliamson: You may want to close this issue to help keep things cleaned up. This solution seems to me to be a good answer. But maybe I'm missing something?