Shekkar Shekkar - 8 months ago 43
AngularJS Question

ng-grid with popup edit and save

By using the ng-grid="gridOptions" i can display the data ,my app.js file code is

$scope.gridOptions = {
data: 'myData',
enableCellSelection: true,
enableCellEdit: true,
enableRowSelection: false,
columnDefs: [{field: 'name', displayName: 'Name', enableCellEdit: true}, {field:'age', displayName:'Age'}]

Now how can i get the popup by clicking on the cell data ,in the popup the cell data have to edit and save the changes in grid .Anyone please ...


You just need to override your cell template in your edit column templates. columnDefs would be like below

var cellTemplate='<div class="ngCellText"  data-ng-model="row"><button data-ng-click="updateSelectedRow(row,$event)">Edit</button></div>'

columnDefs: [{field: 'name', displayName: 'Name', enableCellEdit: true}, 
  {field:'age', displayName:'Age'},

attach updateSelectedRow function to your controller scope,this function gets the first parameter as entire row object. you can access all columns by doing row.entity. also you can perform two-way binding with row.entity object, it updates the grid data whenever it changes.

check out this plunker