skip to Main Content

I am using adaptable grid/ ag grid in my application,
table looks like-

Finance | May 2020 | May 2021

revenue |23        | 22
tax     |          | 21

Now If I dont pass data for may 2020 tax grid automatically renders empty cell, But I want this to be custom, I want to display ‘-

2

Answers


  1. You can use a custom cell renderer and do this :

    cellRenderer: (params) => (params.value) ? params.value : ‘-‘;

    https://www.ag-grid.com/react-data-grid/component-cell-renderer/

    Login or Signup to reply.
  2. You can utilize a function alongside the valueFormatter in your column definitions. Here’s a brief example to illustrate this:

    function emptyDataFormatter(params) {
      return params.value? params.value : '-';
    }
    

    In this function, you’ll automatically receive params from the valueFormatter of the column. The function checks if params contains a value and returns that value. If no value is present, it returns a dash ("-").

    To apply this function to a column, you can use it in your column definition like so:

    {
      field: 'your.field-here',
      headerName: 'your.field-name-here',
      valueFormatter: emptyDataFormatter,
    }
    

    With this setup, your row data will render the value of the column or a dash ("-") if the value is not available.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search