Dash AG-Grid: how do I remove the column header index?

Dash Python
1

I’ve read the docs but didn’t see any mention of the index… and weirdly, the examples in there don’t even show the index number. How do I remove the numbers in the column headers?

image
image1039×48 1.62 KB 

...
ep1_df = pd.read_json('json/episode1.json')

# Create the Dash AgGrid for episode 1
ep1_grid = dag.AgGrid(
  id = "ep1_grid",
  rowData = ep1_df.to_dict("records"),
  defaultColDef = {
    "resizable": True,
    "sortable": True,
    "filter": True,
    "sort": 'asc'
  },
  columnDefs = [
    {
      "field": i,
      "type": "numericColumn",
      "filter": "agNumberColumnFilter",
      # Insert commas in the numeric columns
      "valueFormatter": {"function": "d3.format(',.0f')(params.value)"},
      "valueGetter": get_value_getter(i),
    } if i in ep1_numeric_cols else {
      "field": i,
      "type": "textColumn",
      "filter": "agTextColumnFilter",
      "floatingFilter": True,
      "suppressMenu": True,
      "filterParams": {
        "filterPlaceholder": "Search...",
      },
    } for i in ep1_df.columns
  ],
  columnSize = "autoSize",
  className = "ag-theme-alpine-dark",
)
2

Hello @the.oldest.house !
Can you provide one record of your file episode1.json?

3

Hello @the.oldest.house,

This isn’t an index, but the order of how your sorting is being applied.

When you put a columnDef as asc, you are telling that column to sort ascending values.

When sorting multiple columns, the grid will place a number by the column header to indicate the order in which the sorting as been applied.

4

Hey @jinnyzor !
I thought maybe it was coming from the data columns label.
(I didn’t go through the row sorting docs page yet :laughing:)
But that make sense by applying a sorting order on all cols (in defaultColDef) we have a multi column sorting applied in the columns order…

1 Like
5

Got it, thanks. I avoided the problem by sorting the dataframe alphabetically first before exporting to JSON, then removed "sort": 'asc' from the defaultColDef.

TIL!

1 Like