Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/426.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用CellNav+;编辑使网格从网格外的输入窃取焦点_Javascript_Angularjs_Angular Ui Grid - Fatal编程技术网

Javascript 使用CellNav+;编辑使网格从网格外的输入窃取焦点

Javascript 使用CellNav+;编辑使网格从网格外的输入窃取焦点,javascript,angularjs,angular-ui-grid,Javascript,Angularjs,Angular Ui Grid,我有一个应用程序,它在cellNav中使用ui网格,在某些列中使用editOnFocus=true进行编辑。我遇到的问题是编辑功能中的结束单元格编辑和取消单元格编辑总是调用gridCtrl.focus()。如果我聚焦了一个可编辑的单元格,然后单击网格外的输入,它将窃取焦点并将其放回网格中 所发生的是我在网格外点击输入。它受到关注。同时触发结束单元格编辑事件。然后调用gridCtrl.focus(),焦点从外部输入框中移开 是否有方法在ui-grid.edit中重写此行为?为什么这是行为标准 下面

我有一个应用程序,它在cellNav中使用ui网格,在某些列中使用editOnFocus=true进行编辑。我遇到的问题是编辑功能中的结束单元格编辑和取消单元格编辑总是调用gridCtrl.focus()。如果我聚焦了一个可编辑的单元格,然后单击网格外的输入,它将窃取焦点并将其放回网格中

所发生的是我在网格外点击输入。它受到关注。同时触发结束单元格编辑事件。然后调用gridCtrl.focus(),焦点从外部输入框中移开

是否有方法在ui-grid.edit中重写此行为?为什么这是行为标准

下面是一个plnkr演示。如果您单击“年龄”列使其进入编辑模式,然后单击文本区域,您将看到它瞬间获得焦点并有一个光标,但随后网格很快将焦点夺回,您将无法再进行编辑


这种行为对于我的情况并不理想,因为每当选择或导航到某一行时,我们都会自动关注某个特定的单元格(进入编辑模式)。因此,任何更改行或将焦点移到网格外的操作都会触发结束单元格编辑事件和上述焦点行为。

诀窍是设置另一个焦点,但延迟一个摘要周期,从而允许网格执行它需要的操作。相关代码从下面更新的Plunker中剪掉

HTML(用于绑定):

工厂(用于重新聚焦):

更新的Plunker

您可能可以将上述内容组合成一个指令,然后将其应用于所需的控件-如果需要,很乐意提供帮助


希望这能让你有一个好的开始。

我能想出与上面基本相同的方法。尽管我们的用例有一个主要的中断。当您重新聚焦于文本区域时,可编辑字段退出编辑状态,但底层单元格仍被ui网格“聚焦”。这意味着单击行或单元格将不会进入编辑状态。您可以切换行以在新行上进入编辑状态,但如果只有一行,则这不是一个选项。您也可以双击以重新获得焦点,但是我们在该行上有一个双击侦听器,可以打开一个新页面当重新关注“文本区域”并更新Plunker时,这有帮助吗?
<textarea id="textarea" ng-focus="delayFocus()"></textarea>
$scope.delayFocus = function() {
  $timeout(function() {
    focus('textarea');
    $scope.gridApi.grid.cellNav.clearFocus();
  });
}
app.factory('focus', function($timeout, $window) {
  return function(id) {
    // timeout makes sure that it is invoked after any other event has been triggered.
    // e.g. click events that need to run before the focus or
    // inputs elements that are in a disabled state but are enabled when those events
    // are triggered.
    $timeout(function() {
      var element = $window.document.getElementById(id);
      if (element)
        element.focus();
    });
  };
});