How to add custom column dynamically in ag-grid

angularjs ag-grid
Shivek Parmar picture Shivek Parmar · Apr 13, 2016 · Viewed 11.1k times · Source

I'm stacked to add Custom columns dynamically in ag-grid. I have tried following approach.

additionalCol = { field:'SOME RANDOM', headerName: 'SOME RANDOM' };
$scope.gridOptions.columnApi.addValueColumn(additionalCol);

I have also tried

$scope.columns.push(additionalCol);
$scope.gridOptions.api.refreshView();

but didn't get success. I even tried to add columns that exist in Data but failed. Below is Image for what I am trying. enter image description here

As shown in image "% dev" is Custom column which I need to add dynamically with dynamically calculated values.

Answer

Alexander Zbinden picture Alexander Zbinden · Apr 20, 2016

Try this:

var columnDefs = $scope.gridOptions.columnDefs;
columnDefs.push({ field:'SOME RANDOM', headerName: 'SOME RANDOM'});
$scope.gridOptions.api.setColumnDefs(columnDefs);

Related questions

Angular Grid ag-grid columnDefs Dynamically change

I have a problem about columnDefs change dynamically. Here is my gridOptions: $scope.gridOptions = { columnDefs: [], enableFilter: true, rowData: null, rowSelection: 'multiple', rowDeselection: true }; And when I retrieve data from server: $scope.customColumns = []; $http.post('/Home/GetProducts', { tableName: 'TABLE_PRODUCT' }).…

Read More
ag-grid vs slick-grid vs angular-grid which is better?

Recently we thought to change our current grid tool. Currently we're using kendo-ui for grid and all. After searching we came with 3 results. But, still we're not sure which is better and why in future run. While using kendo we …

Read More
How to display column dynamically using ag-grid

I am new to angularjs technology.I'm using ag-grid and want to display column dynamically my json data is: [{Date:'12-12-2015',Name:'ammu',mark:20},{Date:'12-12-2015',Name:'appu',mark:24},{Date:'12-12-2015',…

Read More