Reputation: 15
I have seen the post "How can I update my server with changed data from ng-grid?" but i think it's not feasible for my situation. I have multiple ng-grid (could be more than 15 inside of multiple accordion) in same controller. Keeping track of all those individual cells of an individual ng-grid does not seem to be sensible. Is there a way to extract whole data of one ng-grid rather than keeping track of individual cells??
Upvotes: 1
Views: 1106
Reputation: 6187
You can listen to ngGridEventData event, so when the grid data source is changed this event is fired letting you know that data was successfully modified.
Example:
html:
<div ng-controller="MyCtrl">
<button ng-click="addPerson1()">Add PersonA</button>
<div class="gridStyle" ng-grid="gridOptionsA"></div>
<button ng-click="addPerson2()">Add PersonB</button>
<div class="gridStyle" ng-grid="gridOptionsB"></div>
</div>
js:
app.controller('MyCtrl', function($scope) {
$scope.gridOptionsList=[];
$scope.myDataA = [
{name: "Moroni", age:29},
{name: "Tiancum", age: 35},
{name: "Jacob", age: 15},
{name: "Nephi", age: 75},
{name: "Enos", age: 7}
];
$scope.myDataB = [
{name:"Moroni",age:29},
{name:"Tiancum",age:35},
{name:"Jacob",age:15},
{name:"Nephi",age:75},
{name:"Enos",age:7}
];
$scope.gridOptionsA = {
data: 'myDataA'
};
$scope.gridOptionsB = {
data: 'myDataB'
};
$scope.gridOptionsList=[$scope.gridOptionsA,$scope.gridOptionsB];
$scope.addPerson1=function(){
$scope.myDataA.push({name: "Alex", age:30});
}
$scope.addPerson2=function(){
$scope.myDataB.push({name: "Ben", age:40});
}
$scope.$on('ngGridEventData', function (event,gridId) {
var filteredGrid=$scope.gridOptionsList.filter(function(grid){
return grid.gridId==gridId;
})
$scope.filteredGrid=filteredGrid[0];
//grid data
$scope.filteredGridData=$scope.filteredGrid.ngGrid.data;
});
Live example: http://plnkr.co/edit/aFZ6YJ0cqHdRZNdasfJ6?p=preview
Upvotes: 2