Skip to content

Commit

Permalink
DataGrid - Add focused row events (#5637)
Browse files Browse the repository at this point in the history
  • Loading branch information
@AntonSermyazhko
AntonSermyazhko authored Oct 5, 2018
1 parent fd4b40a commit 0f98f26
Show file tree
Hide file tree
Showing 3 changed files with 1,352 additions and 84 deletions.
69 changes: 53 additions & 16 deletions js/ui/grid_core/ui.grid_core.focus.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,10 +21,10 @@ exports.FocusController = core.ViewController.inherit((function() {
var that = this;

if(args.name === "focusedRowIndex") {
that.focusRowByIndex(args.value);
that._focusRowByIndex(args.value);
args.handled = true;
} else if(args.name === "focusedRowKey") {
that.focusRowByKey(args.value);
that.navigateToRow(args.value);
args.handled = true;
} else if(args.name === "focusedColumnIndex") {
args.handled = true;
Expand All @@ -35,7 +35,7 @@ exports.FocusController = core.ViewController.inherit((function() {
}
},

focusRowByIndex: function(index) {
_focusRowByIndex: function(index) {
index = index !== undefined ? index : this.option("focusedRowIndex");

var dataController = this.getController("data"),
Expand All @@ -47,17 +47,23 @@ exports.FocusController = core.ViewController.inherit((function() {
}
},

focusRowByKey: function(key) {
publicMethods: function() {
return ["navigateToRow"];
},

/**
* @name dxDataGridMethods.navigateToRow
* @publicName navigateToRow(key)
* @param1 key:any
*/
navigateToRow: function(key) {
var that = this,
dataController = this.getController("data"),
rowsView = this.getView("rowsView"),
rowIndex = this.option("focusedRowIndex");

key = key !== undefined ? key : this.option("focusedRowKey");

if(!this.option("focusedRowEnabled")) {
return;
}
var rowIndexByKey = dataController.getRowIndexByKey(key) + dataController.getRowIndexOffset();

if(rowIndex >= 0 && rowIndex === rowIndexByKey) {
Expand All @@ -66,7 +72,9 @@ exports.FocusController = core.ViewController.inherit((function() {
dataController.getPageIndexByKey(key).done(function(pageIndex) {
that._needRestoreFocus = $(rowsView._getRowElement(that.option("focusedRowIndex"))).is(":focus");
if(pageIndex === dataController.pageIndex()) {
dataController.reload();
dataController.reload().done(function() {
that._triggerUpdateFocusedRow(key);
});
} else {
dataController.pageIndex(pageIndex).done(function() {
that._triggerUpdateFocusedRow(key);
Expand All @@ -81,6 +89,7 @@ exports.FocusController = core.ViewController.inherit((function() {
rowIndex = dataController.getRowIndexByKey(key) + dataController.getRowIndexOffset();

this.getController("keyboardNavigation").setFocusedRowIndex(rowIndex);

dataController.updateItems({
changeType: "updateFocusedRow",
focusedRowKey: key
Expand All @@ -101,7 +110,7 @@ exports.FocusController = core.ViewController.inherit((function() {
}
keyboardController.setFocusedRowIndex(focusedRowIndex);
} else {
this.focusRowByKey(focusedRowKey);
this.navigateToRow(focusedRowKey);
}
} else {
focusedRowKey = dataController.getKeyByRowIndex(focusedRowIndex);
Expand All @@ -128,22 +137,24 @@ exports.FocusController = core.ViewController.inherit((function() {
var that = this,
focusedRowIndex = that._dataController.getRowIndexByKey(change.focusedRowKey),
rowsView = that.getView("rowsView"),
$focusedRow,
$tableElement;

each(rowsView.getTableElements(), function(_, element) {
$tableElement = $(element);
that.clearPreviousFocusedRow($tableElement);
that._clearPreviousFocusedRow($tableElement);
if(focusedRowIndex >= 0) {
that.prepareFocusedRow(change.items[focusedRowIndex], $tableElement, focusedRowIndex);
$focusedRow = that._prepareFocusedRow(change.items[focusedRowIndex], $tableElement, focusedRowIndex);
that.getController("keyboardNavigation")._fireFocusedRowChanged($focusedRow);
}
});
},
clearPreviousFocusedRow: function($tableElement) {
_clearPreviousFocusedRow: function($tableElement) {
var $prevRowFocusedElement = $tableElement.find(".dx-row" + "." + ROW_FOCUSED_CLASS);
$prevRowFocusedElement.removeClass(ROW_FOCUSED_CLASS).removeAttr("tabindex");
$prevRowFocusedElement.children("td").removeAttr("tabindex");
},
prepareFocusedRow: function(changedItem, $tableElement, focusedRowIndex) {
_prepareFocusedRow: function(changedItem, $tableElement, focusedRowIndex) {
var that = this,
$row,
keyboardController,
Expand All @@ -161,13 +172,16 @@ exports.FocusController = core.ViewController.inherit((function() {
}
}
}

return $row;
}
};
})());

module.exports = {
defaultOptions: function() {
return {

/**
* @name GridBaseOptions.focusedRowEnabled
* @type boolean
Expand Down Expand Up @@ -195,6 +209,12 @@ module.exports = {
* @default -1
*/
focusedColumnIndex: -1

/**
* @name GridBaseMethods.navigateToRow
* @publicName navigateToRow(key)
* @param1 key:any
*/
};
},

Expand All @@ -209,6 +229,14 @@ module.exports = {
var rowIndex = this.option("focusedRowIndex"),
columnIndex = this.option("focusedColumnIndex");

if(this.option("focusedRowEnabled")) {
this.createAction("onFocusedRowChanging", { excludeValidators: ["disabled", "readOnly"] });
this.createAction("onFocusedRowChanged", { excludeValidators: ["disabled", "readOnly"] });
}

this.createAction("onFocusedCellChanging", { excludeValidators: ["disabled", "readOnly"] });
this.createAction("onFocusedCellChanged", { excludeValidators: ["disabled", "readOnly"] });

this.callBase();

this.setRowFocusType();
Expand Down Expand Up @@ -248,7 +276,16 @@ module.exports = {
this.setRowFocusType();
this._focus(this._getCellElementFromTarget(eventArgs.originalEvent.target), true);
}
}
},

_updateFocusedCellPosition: function($cell, direction) {
var prevRowIndex = this.option("focusedRowIndex"),
prevColumnIndex = this.option("focusedColumnIndex");

this.callBase($cell, direction);

this._fireFocusedCellChanged($cell, prevColumnIndex, prevRowIndex);
},
},

selection: {
Expand Down Expand Up @@ -293,13 +330,13 @@ module.exports = {
this._prevPageIndex = this.pageIndex();

if(operationTypes.reload) {
focusController.focusRowByKey();
focusController.navigateToRow();
return;
}

if(paging) {
if(!this.getController("keyboardNavigation")._isVirtualScrolling()) {
focusController.focusRowByIndex();
focusController._focusRowByIndex();
}
} else {
focusController._handleDataChanged(e);
Expand Down
Loading

0 comments on commit 0f98f26

Please sign in to comment.