Aggrid update row data from streamlit form

Custom Components streamlit-aggrid
1

image
image912×561 89.7 KB

I have the above aggrid and right below it I have a streamlit text entry and submit button so the user can edit the title of a selected video. The problem is, i can update the title in the dataframe using the form; however, the changes are not reflected in the aggrid until the user force refreshes (which then restarts the pagination at page 1). Im using aggrid 0.3.4post3.

Is there a way to update an aggrid row from a streamlit form without forcing a refresh?

gb = GridOptionsBuilder.from_dataframe(yt_df)
gb.configure_default_column(editable=False)
gb.configure_column("thumbnail", width=230, cellRenderer=thumbnail_renderer)
gb.configure_column("title",width=450)
gb.configure_column("duration",width=150)
gb.configure_column("description",hide=True)
gb.configure_grid_options(**{"rowHeight":75})
gb.configure_column("transcript", hide=True)
gb.configure_column("edited",width=60, editable=False,hide=True)
gb.configure_column("date",sort='desc',width=220)
gb.configure_column('url',width=125,cellRenderer=button_renderer)
gb.configure_column('enabled',width=60,editable=True,cellRenderer=checkbox_renderer, headerCheckboxSelection=False)
gb.configure_grid_options(domLayout='normal')
gb.configure_selection(selection_mode="single")
gb.configure_pagination(enabled=True,paginationAutoPageSize=False,paginationPageSize=6)
gridOptions = gb.build()
ag_grid = AgGrid(
    yt_df,
    key='aggrid',
    gridOptions=gridOptions,
    width='100%',
    update_mode=GridUpdateMode.SELECTION_CHANGED | GridUpdateMode.VALUE_CHANGED,
    fit_columns_on_grid_load=True,
    allow_unsafe_jscode=True, #Set it to True to allow jsfunction to be injected
    enable_enterprise_modules=False,
    reload_data=False,
    theme='streamlit'
    )