Question

我使用角度ui-grid来显示表格数据。

可以编辑单元格数据。我注意到如果列被排序，然后如果我们编辑单元格，则排序被踢入并移动行。我想在单元格编辑上禁用排序，有没有办法做到这一点。我在下面提供了plunker链接。在plunk中，首先按升序对第一列进行排序，然后将a2的值编辑为x，然后在单元格外单击，您将看到现在已将eidted行移动到最后一行。我想阻止编辑排序，如果我们在编辑时删除所有现有的活动列排序，基本上就可以了。

  <div id="grid1" ui-grid="gridOptions" class="grid" ui-grid-edit >
  </div>

import reactPolymer from 'react-polymer'; //IMPORTANT: Must be imported before React.
import React from 'react';

reactPolymer.registerAttribute('raised');
reactPolymer.registerAttribute('url');
reactPolymer.registerEvent('response', 'onResponse');


<paper-button raised>another button</paper-button>
<iron-ajax url="http://example.com/" onResponse={this.handleResponse} />

see Plunk for the behavior http://plnkr.co/edit/17H5K6nOEz9gf4Keeap9?p=preview

Answer 1

从beginEditCell回调中，您可以知道用户何时正在编辑。您可以利用保存和恢复ui-grid状态的优势。 Save and Restore Ui-grid state 通过afterCellEdit或cancelCellEdit回调，您可以知道用户何时完成编辑，然后您就可以恢复。

Answer 2

将enableSorting设置为false

enableSorting: false

Answer 3

我找到了一种通过简单的黑客来解决这个问题的方法。

当有notifyDataChange事件被触发并调用processRowsCallback函数并且processRowsCallback定义如下所示时，由于回调函数（registerDataChangeCallback）而发生排序。

Grid.prototype.processRowsCallback = function processRowsCallback( grid ){
    grid.queueGridRefresh();
  };

这里Grid是一个工厂，processRowsCallback函数在工厂下定义，它调用grid.queueGridRefresh（）并调用sort，并且在网格中数据发生变化之后发生排序。

所以，我想通过将Grid工厂注入我创建的工厂（extendedGridFactory）来重写原型函数processRowsCallBack，并复制相同的函数但是检查了条件，如果网格不在editmode和调用网格中。 queueGridRefresh（）;如下。

app.factory('extendedGridFactory', ['Grid', '$rootScope', function (Grid, rootScope) {
    var extendedGrid = Object.create(Grid);
    extendedGrid.prototype.processRowsCallback = function processRowsCallback(grid) {
        if (!rootScope.isInEditMode) {
            grid.queueGridRefresh();
        }
    };
    return extendedGrid;
}]);

很好，到目前为止它的工作正常。

如果您发现此代码存在任何问题，请告诉我们。：）

如何在角度ui网格中禁用编辑排序

3 个答案: