CODEWITHSUNDEEP
javascriptangularjsangular-ui-grid
user250773
user250773

Reputation: 579

Angular UI Grid conditional row expand

I'm using Angular UI Grid and the ui-grid-expandable plugin. Is there a way to decide for each row, if the expand button (+) is displayed? By default it is always displayed, no matter if there is available data in the subgrid.

Thanks.

Upvotes: 4

Views: 3888

Answers (4)

DavidRomo
DavidRomo

Reputation: 171

Just use the last version of UI GRID

https://cdnjs.cloudflare.com/ajax/libs/angular-ui-grid/4.11.0/ui-grid.min.js

Then use the property disableRowExpandable inside your subGridOptions

Here there a little example.

for (i = 0; i < response.data.result.length; i++) {
                    if (response.data.result[i].SubProcesos != null) {
                        response.data.result[i].subGridOptions = {
                            columnDefs: establecerColDefs(response.data.Rol),
                            data: response.data.result[i].SubProcesos,
                            disableRowExpandable: false

                        };
                    } else {
                        response.data.result[i].subGridOptions = {
                            columnDefs: [{ }],
                            data:[{}],
                            disableRowExpandable: true
                    };
                    }
                }

enter image description here

Upvotes: 0

Asher Ababa
Asher Ababa

Reputation: 1

Yes you can !

Add to subGridOptions object this option: 

disableRowExpandable:(condition here).

Upvotes: 0

andrewkittredge
andrewkittredge

Reputation: 850

I have a pull request with UI-GRID that solves this.

You add a boolean to the subGridOptions called disableRowExpandable.

https://github.com/angular-ui/ui-grid/pull/6135/commits/83ade3445711e532f689d224904babfe92c7b45e

Upvotes: 0

imbalind
imbalind

Reputation: 1182

Sadly no, there is not an option for that as of now.

You can use the following to make things work as you wish:

  • remove default row headers by setting to false enableExpandableRowHeader
  • adding a custom row header by calling $scope.gridApi.core.addRowHeaderColumn

This way you can build your own logic. I did something like that in this plunkr.

If you need more info:

Upvotes: 5

Related Questions