Displaying Ag grid table on the streamlit side bar

Custom Components streamlit-aggrid
1

I have been trying to display the Ag Grid table on the sidebar of the streamlit UI. Currently able to display the Ag Grid table with all the functionalities that I want, just want to move to the sidebar and couldn’t find that option in anywhere. It would be great if anyone could help, below is my current code implementation.

import streamlit as st 
import pandas as pd
from st_aggrid import AgGrid, GridUpdateMode, JsCode
from st_aggrid.grid_options_builder import GridOptionsBuilder

# Functions
@st.cache
def data_upload():
    df = pd.read_csv("songs_normalize.csv") # some random csv file
    return df

#st.header("This is Streamlit Default Dataframe")
df = data_upload()
# st.dataframe(data=df)
# st.info(len(df))

gd = GridOptionsBuilder.from_dataframe(df)
gd.configure_pagination(enabled=True)
# gd.configure_default_column(editable=True,groupable=True)
gd.configure_side_bar()
# sel_mode = st.radio('Selection Type', options = ['single', 'multiple'])
gd.configure_selection(selection_mode='multiple',use_checkbox=True)
gridoptions = gd.build()
grid_table = AgGrid(df,gridOptions=gridoptions,
                    update_mode= GridUpdateMode.SELECTION_CHANGED,
                    height = 500,
                    allow_unsafe_jscode=True,
                    #enable_enterprise_modules = True,
                    theme = 'blue')
# st.sidebar(grid_table)
sel_row = grid_table["selected_rows"]
st.subheader("Output")
st.sidebar.dataframe(sel_row)
2

Would this work?

with st.sidebar:
AgGrid(…

1 Like
3

Thanks, that helps.

4

This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.