Question

有没有办法取消编辑更改并将数据恢复为ngGrid中的原始内容，就像按下esc键时的excel一样？

[编辑]

请查看plunkr here

这是网格的javascript

 var app = angular.module('testApp',['ngGrid']);
    app.controller('testAppCtrl',function($scope){
   $scope.gridData =   [{code: "code1", name: "name1" },
                        {code: "code2", name: "name1"},
                        {code: "code3", name: "name3"}];
   $scope.gridOptions = {
   data: 'gridData',
    enableCellSelection: true,
    enableRowSelection: false,
    enableCellEdit: true,
    columnDefs: [
        {field : 'code', displayName: 'Code', enableCellEdit: true},
        {field: 'name',displayName: 'Name', enableCellEdit: true}]
   };
});

网格定义

    <!DOCTYPE html>
<html lang="en" ng-app="testApp">

<head>
  <meta charset="utf-8" />
  <title>Basic Grid</title>
  <script src="jquery-2.1.1.js"></script>
  <script src="angular.js"></script>
  <script src="ng-grid-2.0.11.debug.js"></script>
  <script src="main.js"></script>
  <link href="ng-grid.css" rel="stylesheet" />
  <style>
    .gridStyle {
      border: 1px solid rgb(212, 212, 212);
      width: 400px;
      height: 300px
    }
  </style>
</head>

<body id="main-document-body" ng-controller="testAppCtrl">
  <div class="panel panel-primary">
    <div class="gridStyle" ng-grid="gridOptions"></div>
  </div>
</body>

这里的问题是，即使按下单元格上的“Esc”键，单元也会接受修改后的数据。

Answer 1

请参阅此plunkr

这是类似excel的编辑，双击编辑，按下escape取消任何更改。

您只需要：

enableCellSelection: true,
enableCellEdit: true,

[编辑] （响应您的修改）：

您似乎遇到了与图书馆相关的问题。具有不同版本的相同代码可以正常工作：请参阅this plunkr

在ngGrid中处理ngGridEventEndCellEdit事件时取消更改

1 个答案: