AngularJS和NG网 - 汽车细胞更改后的数据保存到服务器 [英] AngularJS and ng-grid - auto save data to the server after a cell was changed

问题描述

我的使用情况是pretty简单。 A用户，编辑单元（enableCellEdit：真）后，应具有数据自动发送到服务器（对细胞模糊）。我尝试不同的方法，但他们都没有正确地制定。我有一个简约的网格：

My Use Case is pretty simple. A User, after editing a Cell (enableCell true), should have the data "automatically" sent to the server (on cell blur). I tried different approaches but none of them have properly worked out. I have a minimalistic grid:

// Configure ng-grid
$scope.gridOptions = {
    data: 'questions',
    enableCellSelection: true,
    selectedItems: $scope.selectedRow,
    multiSelect: false,
    columnDefs: [
        {field: 'id', displayName: 'Id'},
        {field: 'name', displayName: 'Name'},
        {field: 'answers[1].valuePercent', displayName: 'Rural', enableCellEdit: true}
    ]
};

例如，我试图观看传递到网格的数据模型。但这样做不会回到我编辑的单元格：

For example, I tried to watch the data model passed to the Grid. But doing so won't return me the edited cell:

$scope.$watch('myData', function (foo) {
    // myModel.$update()
}, true);

我试图用ngGridEventData数据事件摆弄，但单元格编辑后不火

I tried to fiddle with the "ngGridEventData" data event but it does not fire after cell edit

$scope.$on('ngGridEventData', function (e, gridId) {
    // myModel.$update()
});

最后，我想观察的单元格。然而，通过网格的selectedCell属性的平均值为一排这种唯一的工作

Finally, I tried to observer a Cell. However, this only work for a row by the mean of the "selectedCell" property of the grid:

$scope.selectedRow = [];

$scope.gridOptions = {
    selectedItems: $scope.selectedRow,
}

$scope.$watch('selectedRow', function (foo) {
    console.log(foo)
}, true);

这是个 NG网插件需要的？我简直不敢相信这是不是开箱。

Is it a ng-grid plugin needed? I can't believe it is not something out of the box.

你有一个指针/片段，我怎么能解决这个自动保存/发送到服务器？

Would you have a pointer / snippet how I could solve the auto save / send to the server?

推荐答案

这也许是新的，但NG-电网实际发布，可用于实现对变化的一个简单的更新事件。

Maybe this is new but ng-grid actually publishes events which can be used to implement a simple update on change.

事件参考：<一href=\"https://github.com/angular-ui/ng-grid/wiki/Grid-Events\">https://github.com/angular-ui/ng-grid/wiki/Grid-Events

举例code（添加到控制器，你设置网格）：

Example code (add to controller where you setup the grid):

$scope.$on('ngGridEventEndCellEdit', function(evt){
    console.log(evt.targetScope.row.entity);  // the underlying data bound to the row
    // Detect changes and send entity to server 
});

有一点要注意的是，该事件将触发，即使在没有修改过，所以你可能还是要（通过'ngGridEventStartCellEdit为例）发送到服务器之前检查更改

One thing to note is that the event will trigger even if no changes have been made, so you may still want to check for changes before sending to the server (for example via 'ngGridEventStartCellEdit')

这篇关于AngularJS和NG网 - 汽车细胞更改后的数据保存到服务器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！