4

Folks,

I am trying to make my ng-grid make rest calls upon editing.

I have followed the clue from this post: AngularJS and ng-grid - auto save data to the server after a cell was changed

However I keep getting this error, if anyone has faced anything similar, pleas advice:

Error: No controller: ngModel
at Error (<anonymous>)
at getControllers (https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js:4823:19)
at nodeLinkFn (https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js:4960:35)
at compositeLinkFn (https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js:4550:15)
at compositeLinkFn (https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js:4553:13)
at publicLinkFn (https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js:4455:30)
at Object.<anonymous> (http://www.yojit.com/app/lib/angular/ng-grid.js:2691:13)
at Object.applyFunction [as fn] (http://www.yojit.com/app/#/employeelist:778:50)
at Object.Scope.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js:8811:27)
at Object.$delegate.__proto__.$digest (http://www.mysite.com/app/#/employeelist:844:31) <input type="text" ng-class="'colt' + col.index" ng-input="row.entity.firstname" ng-blur="updateEntity(col, row)">

my ng-grid looks like this: in my html file:

<div class="gridStyle" ng-grid="gridOptions"> </div>

in my controller:

 var nameEditableTemplate = "<input  type=\"text\" ng-class=\"'colt' + col.index\" ng-input=\"COL_FIELD\" ng-blur=\"updateEntity(col, row)\"/>";


$scope.gridOptions = { data: 'employees',
columnDefs: [
 {displayName:'Id', field:'id'}, 
 {displayName:'First', field:'firstname',enableCellEdit:true, editableCellTemplate:nameEditableTemplate }, 
 {displayName:'Middle', field:'middlename'} ,
 {displayName:'Last', field:'lastname'}      
 ],
 enableCellSelection: true,
 multiSelect:false,

}; //end of grid options
Community
  • 1
  • 1
runtimeZero
  • 26,466
  • 27
  • 73
  • 126
  • 1
    Two things, you could watch the array the grid is bound to for changes like this: $scope.$watch("myData", function(data){console.log(data)}, true) using this first method may be too agressive though as the changes happen on each key press. For handling blur check this: http://stackoverflow.com/questions/15647981/angularjs-and-ng-grid-auto-save-data-to-the-server-after-a-cell-was-changed – shaunhusain Jul 17 '13 at 23:25
  • Thanks shaunhusain..same code not working for me – runtimeZero Jul 18 '13 at 15:08
  • Anyone out there can help me with this ? – runtimeZero Jul 18 '13 at 19:29
  • sorry I can't answer the reason the focus one didn't work out for ya, here's a fiddle that shows that the watch on the data does work, though like I said it gets changes for every keystroke. http://plnkr.co/edit/QqN7Hm?p=preview You could use a timer and a dirty flag to slow down the updates though. – shaunhusain Jul 19 '13 at 03:54
  • 1
    did you check out this [http://plnkr.co/edit/NaxTk9?p=preview](http://plnkr.co/edit/NaxTk9?p=preview)? – Gilad Peleg Sep 05 '13 at 16:48

1 Answers1

0

Your missing your ng-model from the template

var nameEditableTemplate = "<input  type=\"text\" ng-class=\"'colt' + col.index\" ng-model=\"COL_FIELD\" ng-input=\"COL_FIELD\" ng-blur=\"updateEntity(col, row)\"/>";

Hope this solves it

Jon
  • 301
  • 4
  • 9