AngularJS ui grid edit not working with group

Question

I'm using angular ui-grid, it is working fine but when I apply grouping from option, edit functionality not working.

Please check this plunker.

var app = angular.module('app', ['ngTouch', 'ui.grid','ui.grid.edit', 'ui.grid.grouping', 'ui.grid.pinning','ui.grid.exporter','ui.grid.selection']);

app.controller('MainCtrl', ['$scope', 'uiGridConstants', function ($scope, uiGridConstants) {
  $scope.columns = [

    //Below line is with default groupby functionality (If we uncomment below line edit functionality on cell double click is not working)
    { field: 'GHC', grouping: { groupPriority: 1 }, pinnedLeft: true}, 
    //Below line is with without groupby functionality (If we comment above line and uncomment below line  edit functionality on cell double click is working as expected)
    //{ field: 'GHC',  pinnedLeft: true}, 

    { field: 'Status', filter: {
          type: uiGridConstants.filter.SELECT, 
          selectOptions: [ { value: 'Active', label: 'Active' }, { value: 'Won', label: 'Won' }, { value: 'Lost', label: 'Lost'}, { value: 'InActive', label: 'InActive' }]
        }
    },
    { field: 'Region' },
    { field: 'Country' },
    { field: 'City' },
    { field: 'Industry'},
    {  field: 'SubIndustry',displayName: 'SubIndustry' }, 
    { field: 'Date Of Win' }];
  $scope.gridOptions = {
    enableFiltering: true,
    exporterMenuCsv: true,
    enableGridMenu: true,
    exporterCsvFilename: 'myFile.csv',
    columnDefs: $scope.columns
  }
  $scope.gridOptions.data = data;
}]);

PaulL · Accepted Answer · 2015-05-20 10:25:01Z

1

OK, it looks to me like the problem is that group header rows don't allow editing. When the grid first renders all the groups are collapsed, so none of the rows are editable. When you expand to show some detail rows we reuse the DOM, and the editable property isn't re-evaluated. In short, you've found a bug. I suggest you raise an issue, I can look at it as part of some work I'm doing on grouping at the moment.

answered May 20, 2015 at 10:25

PaulL

6,6503 gold badges37 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Nitu Bansal Over a year ago

can you give a quick solution for that, if you have any idea about that. thanks in advance

PaulL Over a year ago

You can edit your ui-grid.js, about line 17666, in the insertGroupHeader function, delete the line headerRow.enableCellEdit = false;

PaulL Over a year ago

I've done a full patch in unstable, which preserves the fact that group header rows shouldn't be editable. But this is part of a big grouping rewrite which might still be quite unstable - and has some breaking changes. You may want to wait a little while for it to stabilise a bit.

Collectives™ on Stack Overflow

AngularJS ui grid edit not working with group

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related