Binding ag-grid columns to an array

Viewed 3640

I am new to ag-grid and am using ag-grid with angularjs (1.X). I am running in to some issues and would greatly appreciate your help.

In my scenario, the number of columns in my grid is not fixed. depending on the user input, the grid columns and their count change. So, I am dynamically defining my column defs based on the data returned by the server ( calling thru ajax).

This is how my data looks like.

rowData = [ { "name": "Tom", "Skills": ["JS", "Angular", "PHP" ] } , 
            { "name": "Tim", "Skills": ["C#, "Java", "C++" ] }
          ]

Once I complete dynamically generating my columnDefs, my columnDefs look like this:

columnDefs = [ { "headerName": "Name", "field": "name"},
               { "headerName": "Skill1", 
                 "valueGetter": "getSkill", 
                 "colId": 0, 
                 "onCellValueChanged" = skillEdited,
                 "editable": true },
               { "headerName": "Skill2", 
                 "valueGetter": "getSkill", 
                 "colId": 1, 
                 "onCellValueChanged" = skillEdited,
                 "editable": true },
               { "headerName": "Skill3", 
                 "valueGetter": "getSkill", 
                 "colId": 2, 
                 "onCellValueChanged" = skillEdited,
                 "editable": true }
             ]

Question-1 : When I change a skill in the grid, my "skillEdited" method gets called, but the params.newValue is set to oldValue and params.oldValue is set to undefined. So, I basically don't get the new value. when the user changes a skill, I want the rowData class to be updated. How can I achieve this?

Question-2 : Am I binding the data and columns correctly ? or am I doing something fundamentally wrong ?

thanks a lot in advance for your help. Vij

1 Answers
Related