I am new to AG Grid and trying to bind some data to the grid. For one of the column which shows cost, I am trying to format it in currency but my params.data is coming null. I dont know what is the correct way of getting the params so that my params will have data for that row and column. When I console params, I see a lot of properties but data and value is undefined. Below is what I am trying to do. In my third else if, I am trying to format that entire column value in currency format but params.data is coming null. Also my grand row total is not appearing even after using the property. Any help is much appreciated

function BindDataToAGGrid(result, columnData, agGridPlaceHolderName, agChartPlaceHolderName) {
        
        $('#siteTypeHeadCountReportAGGrid').text('');
        $('#siteTypeHeadCostReportAGGrid').text('');
        $('#siteHeadCountReportAGGrid').text('');
        $('#siteHeadCostReportAGGrid').text('');

        // Preparing data for columnDefs
        var columnsArray = [];
        
        if (columnData.length > 0) {
            for (var i = 0; i < columnData.length; i++) {
                if (columnData[i] == "CostCenter" || columnData[i] == "Site" || columnData[i] == "ResourceType" ||
                    columnData[i] == "EStaff" || columnData[i] == "EStaffSub" || columnData[i] == "Year") {
                    var obj = {
                        field: columnData[i],
                        filter: "agTextColumnFilter",
                        rowGroup: false,
                        enableRowGroup: true,
                        pivot: true
                    }
                    columnsArray.push(obj);
                }
                else if (columnData[i] == "SiteType" || columnData[i] == "CoreApp")
                {
                    var obj = {
                        field: columnData[i],
                        filter: "agTextColumnFilter",
                        rowGroup: true,
                        enableRowGroup: true,
                        hide: true,
                        pivot: true
                    }
                    columnsArray.push(obj);
                }
                else if ((agGridPlaceHolderName == "siteTypeHeadCostReportAGGrid" || agGridPlaceHolderName == "siteHeadCostReportAGGrid")
                    && columnData[i] == "HeadCount") {
                    var obj = {
                        field: columnData[i],
                        filter: "agTextColumnFilter",
                        rowGroup: false,
                        enableRowGroup: true,
                        hide: true,
                        pivot: true
                    }
                    columnsArray.push(obj);
                }
                else if ((agGridPlaceHolderName == "siteTypeHeadCostReportAGGrid" || agGridPlaceHolderName == "siteHeadCostReportAGGrid") && columnData[i] == "HeadCost")
                {
                    var obj = {
                        field: columnData[i],
                        valueFormatter: params => currencyFormatter(params.data.HeadCost, "$"),
                        filter: "agTextColumnFilter",
                        rowGroup: false,
                        enableRowGroup: true,
                        pivot: true
                    }
                    columnsArray.push(obj);
                }
                else if ((agGridPlaceHolderName == "siteTypeHeadCountReportAGGrid" || agGridPlaceHolderName == "siteHeadCountReportAGGrid")
                    && columnData[i] == "HeadCost") {
                    var obj = {
                        field: columnData[i], 
                        filter: "agTextColumnFilter",
                        rowGroup: false,
                        enableRowGroup: true,
                        hide: true,
                        pivot: true
                    }
                    columnsArray.push(obj);
                }
                else {
                    var obj = {
                        field: columnData[i],
                        aggFunc: "sum",
                        filter: "agTextColumnFilter",
                        rowGroup: false,
                        enableRowGroup: true,
                        pivot: true
                    }
                    columnsArray.push(obj);
                }
            }
        }
        const gridOptions = {
            rowStyle: { "font-weight": "bold" },
            pagination: true,
            paginationPageSize: 10,
            paginationPageSizeSelector: [10, 20, 50, 100, 200, 500, 1000],
            rowData: result,
            columnDefs: columnsArray,
            defaultColDef: {
                flex: 1,
                minWidth: 105,
                cellClass: "number-cell",
                // allow every column to be aggregated
                enableValue: true,
                // allow every column to be grouped
                enableRowGroup: true,
                // allow every column to be pivoted
                enablePivot: true,
                filter: true,
                editable: false,
            },
            autoGroupColumnDef: {
                minWidth: 200,
                //filter: 'agGroupColumnFilter',
            },
            sideBar: {
                toolPanels: [
                    {
                        id: "filters",
                        labelDefault: "Filters",
                        labelKey: "filters",
                        iconKey: "filter",
                        toolPanel: "agFiltersToolPanel",
                    },
                ],
                defaultToolPanel: "",
            },
            grandTotalRow: 'bottom',
            /* groupSuppressBlankHeader: true,*/
            /* enablePivot: true,*/
            onCellValueChanged: (event) => {
                console.log(`New Cell Value: ${event.value}`);
            },
            enableCharts: true,
            rowGroupPanelShow: 'always',
            groupDisplayType: 'singleColumn',
        };
        // Your Javascript code to create the data grid
        
        //const myGridElement = document.querySelector('#siteTypeHeadCountReportAGGrid');
        const myGridElement = document.querySelector('#' + agGridPlaceHolderName);
        gridApi = agGrid.createGrid(myGridElement, gridOptions);
        
    }

    function currencyFormatter(currency, sign) {
        var sansDec = currency.toFixed(0);
        var formatted = sansDec.replace(/B(?=(d{3})+(?!d))/g, ",");
        return sign + `${formatted}`;
    }