Rohit Sonawane
Rohit Sonawane

Reputation: 15

How to save data in ng-grid?

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

Answers (1)

Alex Choroshin
Alex Choroshin

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

Related Questions