AG Grid value getter with editable columns

Dash Python
1

Hi,
I am trying to implement a “ValueGetter” function in my AG Grid table. In this case I have 3 columns called “1”, “2”, “3”. In the column “Sum” I want to calculate the sum of the first 3 columns. As long as I use data loaded from a DataFrame the “ValueGetter” function works and I get the sum. However, if I edit one of the values, it seems like the table creates a str value instead of a number. Therefore, the sum results in an addtion of the strings. E.g. if “1”=5, “2”=10 and “3”=3, i get 5103 instead of 18. As I said this only happens after editing a value. I tried to define a column type and a valueformatter, unfortunately without success. I also tried to use “params.getValue” instead of params.data, but also this does not help. Any ideas how to get this work?

columnDefs=[
                    {
                        "field": "1",
                        "editable": True,
                        "type": "numeric",
                        "valueFormatter": {
                            "function": "d3.format('(,.1f')(params.value)"
                        },
                    },
                    {
                        "field": "2",
                        "editable": True,
                        "type": "numeric",
                        "valueFormatter": {
                            "function": "d3.format('(,.1f')(params.value)"
                        },
                    },
                    {
                        "field": "3",
                        "editable": True,
                        "type": "numeric",
                        "valueFormatter": {
                            "function": "d3.format('(,.1f')(params.value)"
                        },
                    },
                    {
                        "field": "Sum",
                        "valueGetter": {
                            "function": "params.data['1']+params.data['2']+params.data['3']);"
                        },
                    },
]
2

Hi @kalt

Try adding this to to the columnDefs:

'valueParser': {'function': 'Number(params.newValue)'}},
3

That does the trick. Thank you!

1 Like