DASH AG GRID - How to filter and deal with numerical options in agSelectCellEditor?

Dash Python
1

Hello Fellows!

You can get the MRE to reproduce the code CLICKING HERE

I’m working with a Dash Ag Grid, but the project has a requirement:
THE COLUMNS WILL be represented in the ROWS and the values will be represented in the COLUMNS (as you can see in the picture below)
image

I have already found ways to deal with the style of the cells, but I’m now facing two different issues that I tried to find references in AG-GRID and DASH-AG but without success

Issue 1 - I have one column (row in this case) which has more than 1000 options that can be selected, so I would like to know HOW CAN I ALLOW THE USER TO TYPE AND FILTER THE DROPDOWN?

image
image493×712 35.4 KB

I tried using few parameters that don’t work :

{
  component: 'agSelectCellEditor',
    params: {
       values: options,
       allowTyping: true,
       filterList: true,
       highlightMatch: true,
    }
}

And also, on other agSelectCellEditor I have options that can be for instance:

“Option 1”, “option 2”, “3”, “other option”

but if I do use "3"as option seems like the framework transform it to string and then an error is raised on Ag Grid
image

I would appreciate it so much any help; Thank you in advance

2

Hello @kabure,

You can use a custom editor like dmc select in which cause you can provide a limit to the amount of options. You can also allow them to search for the match. :slight_smile:

Limiting the default grid select I believe it restricted to AG Grid Enterprise.

If you are using that, then check out the documentation for agRichSelectCellEditor.

3

Hello Bryan @jinnyzor Thank you for your answer, man!

The issues I’m facing in this project mainly caused because of my project use a TRANSPOSED DATAFRAME which increases the complexity of the implementations I need to do; So it’s not simply set the parameters to the column, but I need to deal with it directly on the agGridFunctions.js

I tried implementing what you suggested, but instead of allowing me to filter when typing, the dropdown options stopped to be rendered :frowning_face:
image


image
image573×504 17.3 KB

Do you know what I’m doing wrong, or how can I manage it to work?

As mentioned above, you can find the reproducible example here: GitHub - kaburelabs/dag-rows-styling: It's a implementation of style and other customizations for DASH-AG-GRID to the ROWS

Thank you in advance again mate

4

Hello @kabure,

This requires AG Grid enterprise to use. I would recommend using DMC_Select instead if you arent using AG Grid enterprise.

5

Hey @jinnyzor thank you for your suggestion;

Yeah, I have implemented the DMC_select as you suggested, and it worked as expected :raised_hands:

The issue I’m facing now, is caused because of one of my columns has more than 38k options, so it takes some time to load and render the list of options :weary:

6

You know that dmc_select has the limit function to limit the number of options.

Plus, if these options never change, then you can actually just pass the options into a clientside variable for your editor to pick up.

This is what I do at work for all the drop down options that I utilize.

1 Like
7

WOW!!! Thank you so much for this tip @jinnyzor

I didn’t know about this… I have just implemented a limit, and it solved the problem completely!

2 Likes