3.2.0

Tabbing from Cell to Cell in editable grid

Anyone have this working in 2.5.5? I have tried several methods found in posts here and when i tab to move from current cell - the "focus" goes to the address bar of the browser instead of to the next cell.

Ben W (ScheduleForce)
December 28,
Switch to single cell mode:

grid.setSelectionMode("single-cell");


You can then edit and navigate in the grid naturally (ie without tabbing but with Arrows and Enter keys). If you need tabbing (for consistency), use (code not tested by me, but given by Alex some time ago):

grid.setController("myTabKeys", {
  onKeyTab: function(event){
    if (this.getCurrentColumn() != this.getLastColumn()){
      this.selectCell(this.getNextColumn(), this.getCurrentRow());
      }
    else if (this.getCurrentRow() != this.getLastRow()){
      this.selectCell(this.getFirstColumn(), this.getNextRow());
      }
    else {
      return; // allow default tab action - jump to the next control
      }
    AW.setReturnValue(event, false);
    },
  onKeyShiftTab: function(event){
    if (this.getCurrentColumn() != this.getFirstColumn()){
      this.selectCell(this.getPreviousColumn(), this.getCurrentRow());
      }
    else if (this.getCurrentRow() != this.getFirstRow()){
      this.selectCell(this.getLastColumn(), this.getPreviousRow());
      }
    else {
      return; // allow default shift-tab action - jump to the previous control
      }
    AW.setReturnValue(event, false);
    }
  });

tmtisfree
December 29,

This topic is archived.

See also:


Back to support forum