Angular UI Grid在导航上将焦点设置到单元格

我有一个可编辑的网格。两个列是ItemCode和Quantity。当用户输入数量并按下向下键时，我希望下一行将焦点置于下一行的ItemCode单元格上。我添加了这个事件监听器，它会转到单元格，但它会快速闪烁进入编辑模式，然后进入选定模式。我如何确保单元格保持编辑模式？Angular UI Grid在导航上将焦点设置到单元格

gridApi.cellNav.on.navigate($scope, function (newRowcol, oldRowCol) { 
    $scope.$broadcast('uiGridEventEndCellEdit'); 

    if (oldRowCol != null && 
     oldRowCol.col.colDef.name == 'quantity' && 
     oldRowCol.row != newRowcol.row) { 
     newRowcol.row.grid.api.cellNav 
      .scrollToFocus(newRowcol.row.entity, 
          newRowcol.row.grid.options.columnDefs[1]); 
     } 
    });

UPDATE：这是我的columnDefs：

$scope.gridOptions.columnDefs = [ 
{ 
    name: 'itemCode', 
    displayName: 'Part #', 
    editableCellTemplate: $scope.itemCodeEditableTemplate, 
    width: 150, 
    cellTooltip: function (row, col) { 
     return row.entity.itemCode 
    } 
}, 
{ 
    name: 'quantity', displayName: 'Qty', type: 'number', width: 60, 
    cellTooltip: function (row, col) { 
     return row.entity.quantity 
    } 
} 
]

来源

2016-08-02 Asagohan

我相信这是一个角度UI网格的错误。当我将它作为一个bug提出时，它被关闭了，没有解决问题的细节。请参阅https://github.com/angular-ui/ui-grid/issues/4812和我的SO帖子http://stackoverflow.com/questions/33991169/scrolltofocus-to-cell-with-enablecelleditonfocus-true-does -not-make-the-cell-edi –

我有一个解决方法，它适用于我希望跳转到下一行的字段时使用特定值标记过某个单元格的情况，但是我意识到它不适用于你的情况下，你正在使用向下键移动。基本上，它涉及在列定义中使用enableCellEdit：false创建假间隔列。如果您可以要求用户在单元格之间制作标签，请发布您的列定义，我可以将解决方法分享为可能的答案。 –

好的。感谢您的答复。我要去尝试https://www.ag-grid.com/，看看这是怎么回事，因为我已经有了一个针对typeahead的UI-Grid的工作方式等等。我将要结束工作到处都是。如果ag-grid无效，那么我会问你的解决方法 – Asagohan

正如我上面的评论，我相信这是角度的UI电网的错误。我的解决方法如下...

问题是使用scrollToFocus()去另一行，但你正常的键盘操作（选项卡，向下箭头等）将带你到一列有enableCellEdit: true。因此，一种解决方法是将您拨打scrollToFocus()的地址后面的列设置为enableCellEdit: false。

这很丑陋，但我在每一列可能被选中后创建了一个“spacer”列。

{ name: 'itemCode', displayName: 'part #' }, 
{ name: 'quantity', displayName: 'qty' }, 
{ name: '_spacer1', displayName: '', width: '0%', minWidth: 1, maxWidth: 1, enableCellEdit: false }, 
{ name: 'someOtherColumn', displayName: 'something'},

所以，在我的情况，我想从“量”到“someOtherColumn”抓标签，如果row.entity.quantity的值为0（例如），那么我会叫scrollToFocus()到下一行。因为标签的正常下一个单元格有enableCellEdit: false它可以工作。

现在对于您的情况，我不确定它是否有帮助，因为您正在使用向下箭头按键，这意味着您不会使用正常的键盘操作更改列。但也许它给了你一个想法。（此外，如果您的用户会选择而不是向下箭头，那么您可以使用解决方法，或者甚至可能不需要它，具体取决于您拥有的其他列。）

我认为一个更好的主意可能是重新打开我的错误（在上面的评论中链接），并说你也有问题，看看你是否能够直接回答真正的修复应该是什么！（我很乐意看到它。）

来源

2016-08-03 20:55:38

Angular UI Grid在导航上将焦点设置到单元格

回答

相关问题