Copy and Paste from ag-grid

Custom Components streamlit-aggrid
1

Hi Everyone,

Has anyone using the ag-grid custom component gotten a copy-paste functionality working that works the way users expect? I’ve set editable=True in the configure_default_column function to enable copying cells, but I think users would like to be able to copy and paste a table into another destination, probably as html. But do any of you have a solution you can share/discuss?

Thanks,

Garry

1 Like
2

Hi @, and welcome to the Streamlit community! :balloon::raised_hands:

Regarding your question, you may want to reach out to @PablocFonseca, who created this awesome ag grid component.

Best,
Charly

3

Hey Garry,

Ag-grid supports clipboard interaction when enable_enterprise_modules = True and gridOptions is properly configured.

Take a look at: JavaScript Data Grid: Clipboard

Pablo

1 Like
4

Good to be here!

Thanks Pablo for the tips/link, and of course thanks for the wonderful component in the first place!

Ok, I’ve added that and changed the default column config a bit. With what I have I am able to copy/paste single cells, but I can’t even select multiple cells. So it looks like:

gb.configure_default_column(groupable=True, 
                                value=True, 
                                enableRowGroup=True, 
                                editable=True,
                                enableRangeSelection=True,
                            )
# Column configs
gb.configure_column("columns",
                        headerName="http link",
                        cellRenderer=http_renderer,
                        width=100)
gb.configure_column("of",
                        headerName="Count",
                        type=["numericColumn", "numberColumnFilter"],
                        width=50)
gb.configure_column("data",
                        headerName="Percent Match",
                        cellRenderer=percentage_renderer,
                        type=["numericColumn", "numberColumnFilter"],
                        width=50)

gridOptions = gb.build()

AgGrid(
        grid_df[['columns', 'of', 'data']],
        gridOptions=gridOptions,
        fit_columns_on_grid_load=True,
        height=800,
        enable_enterprise_modules=True,
        allow_unsafe_jscode=True  # Set to True to allow JsCode to be injected
    )

I suspect I am missing something - do I need to implement JsCode handlers for the clipboard events like the examples on the AgGrid page? Or maybe I don’t have enterprise features set up properly?

Thanks for your help,

Garry

5

Hi @Garry_tri, How do you define http_renderer? I want to make the hyperlinks clickable in the ag-grid, but haven’t figured out how to do it so far.

Thanks!

6

I have faced same issue what cannot select multiple rows. I tried gb.configure_selection(selection_mode=‘multiple’) which allows to click whole row instead of each row. Did you fix this issue yourself?

7

I added gb.configure_grid_options(enableRangeSelection=True) and it allows to multiselect. but streamlit is always refresh once copy and paste the data.