Make only some cells editable in ngGrid?

6
votes

I have an ngGrid that shows a few records with basically key / value content. Now, I would like to make some of these records editable.

Using the enableCellEditing features of ngGrid, I can enable or disable editin for a complete column - but what if I only want to enable it for some rows in that column? Is there any way to dynamically configure this for each row?

2
angularjsng-grid
custom edit templates I think is the only way at the moment - Davin Tryon
But they are equal for all rows, aren't they? What, e.g., if I wanted to have a different kind of edit template depending on the cell content, e.g. different input fields for different data types? - Golo Roden
Yes, but in the custom template you could look at a certain scope property or call a scope function to see if the cell should be editable. - Davin Tryon
Ah, okay, I see ... basically using ng-if or something like that inside the template, and calling a function on the scope with the cell as parameter to verify whether this cell should be editable, right? - Golo Roden
Yeah, something like that would work. - Davin Tryon

2 Answers

3
votes

Late answer, but ng-grid (which is now being redone as ui-grid) now has a cellEditableCondition that you can use to make only some cells editable.

You just add it in your gridOptions :

enableCellEditOnFocus: true,
cellEditableCondition: 'row.rowIndex !== 2' //can edit all rows except for the third

Example plunker

This feature availble only after ng-grid 2.0.9

0
votes

You can use cellEditableCondition like below code

{ field: 'planTypeName',displayName:$rootScope.commonProperty.name,enableCellEditOnFocus: true,enableCellEdit:true,cellEditableCondition: function( $scope ) { return $scope.row.entity.sts=='A'; }},