I just uncovered streamlit and ag grid.
I managed to implement a sample ap using ag-grid.
Now I have a question.
I have been struggling for 3 days, with no success.
Question:
My data has two columns (I am interested in): User and Position:
Example data: (User) jodi319, (Position) Project Leader
I have two grids; display these two columns successfully.
How do i link these two columns ?
For example; If I select user JW from User-grid, I want the corresponding Position highlighted in Position grid.
Here is the code In have thus far:
@st.cache(allow_output_mutation = True)
def load_data(file_name):
df_1 = pd.read_csv(file_name)
return df_1
df_0 = load_data("DATA_10_small.csv")
with st.expander("See df_0"):
st.write("df_0 = ",df_0)
# Rename columns
df_0.rename(columns = {' USER':'USER'}, inplace = True)
st.write("df_00 as datafrane:")
# df_000 = pd.DataFrame(df_0)
df_00 = pd.DataFrame(df_0)
st.dataframe(df_00)
#
#
st.sidebar.subheader("St-AgGrid example options")
#
sample_size = st.sidebar.number_input("rows", min_value=10, value=int(len(df_0.index))+1)
#
grid_height = st.sidebar.number_input("Grid height", min_value=1, max_value=800, value=100)
#
return_mode = st.sidebar.selectbox("Return Mode", list(DataReturnMode.__members__), index=1)
return_mode_value = DataReturnMode.__members__[return_mode]
#
update_mode = st.sidebar.selectbox("Update Mode", list(GridUpdateMode.__members__), index=6)
update_mode_value = GridUpdateMode.__members__[update_mode]
#
#
fit_columns_on_grid_load = st.sidebar.checkbox("Fit Grid Columns on Load", value=False)
#
enable_selection=st.sidebar.checkbox("Enable row selection", value=True)
if enable_selection:
selection_mode = st.sidebar.radio("Selection Mode", ['single','multiple'], index=1)
use_checkbox = st.sidebar.checkbox("Use check box for selection", value=True)
if use_checkbox:
groupSelectsChildren = st.sidebar.checkbox("Group checkbox select children", value=True)
groupSelectsFiltered = st.sidebar.checkbox("Group checkbox includes filtered", value=True)
if ((selection_mode == 'multiple') & (not use_checkbox)):
rowMultiSelectWithClick = st.sidebar.checkbox("Multiselect with click (instead of holding CTRL)", value=False)
if not rowMultiSelectWithClick:
suppressRowDeselection = st.sidebar.checkbox("Suppress deselection (while holding CTRL)", value=False)
else:
suppressRowDeselection=False
st.sidebar.text("___")
#
#
#
def createList(r1, r2):
return [item for item in range(r1, r2+1)]
#
#
gb_5 = GridOptionsBuilder.from_dataframe(pd.DataFrame({"USER":df_0['USER'].unique()}))
gb_6 = GridOptionsBuilder.from_dataframe(pd.DataFrame({"POSITION":df_0['POSITION'].unique()}))
#
if enable_selection:
gb_5.configure_selection(selection_mode)
gb_6.configure_selection(selection_mode)
if use_checkbox:
gb_5.configure_column('USER', headerTooltip="User",checkboxSelection=True, headerCheckboxSelection = True)
gb_5.configure_selection(selection_mode, pre_selected_rows=createList(0,len(pd.DataFrame({"USER":df_0['USER'].unique()}).index)), use_checkbox=False, groupSelectsChildren=groupSelectsChildren, groupSelectsFiltered=groupSelectsFiltered)
gb_6.configure_column('POSITION', headerTooltip="Position",checkboxSelection=True, headerCheckboxSelection = True)
gb_6.configure_selection(selection_mode, pre_selected_rows=createList(0,len(pd.DataFrame({"POSITION":df_0['POSITION'].unique()}).index)), use_checkbox=False, groupSelectsChildren=groupSelectsChildren, groupSelectsFiltered=groupSelectsFiltered)
if ((selection_mode == 'multiple') & (not use_checkbox)):
gb_5.configure_selection(selection_mode, use_checkbox=False, rowMultiSelectWithClick=rowMultiSelectWithClick, suppressRowDeselection=suppressRowDeselection)
gb_6.configure_selection(selection_mode, use_checkbox=False, rowMultiSelectWithClick=rowMultiSelectWithClick, suppressRowDeselection=suppressRowDeselection)
#
gridOptions_5 = gb_5.build()
gridOptions_6 = gb_6.build()
#
c1, c2 = st.columns([1,1])
with c1:
grid_return4 = AgGrid(
pd.DataFrame({"USER":df_0['USER'].unique()}), # USER
gridOptions=gridOptions_5,
height=150,
width='70%',
data_return_mode=return_mode_value,
update_mode=update_mode_value,
fit_columns_on_grid_load=fit_columns_on_grid_load,
allow_unsafe_jscode=True,
key = 'c1'
#reload_data = True,
)
with c2:
grid_return5 = AgGrid(
pd.DataFrame({"POSITION":df_0['POSITION'].unique()}), # POSITION
gridOptions=gridOptions_6,
height=200,
width='100%',
data_return_mode=return_mode_value,
update_mode=update_mode_value,
fit_columns_on_grid_load=fit_columns_on_grid_load,
allow_unsafe_jscode=True,
key = 'c2'
#reload_data = True
)
# Creating user selection for USER
user = []
position = []
if len(grid_return4['selected_rows']) > 0:
for l in range(len(grid_return4['selected_rows'])):
user.append(list(grid_return4['selected_rows'])[l]['USER'])
#
st.write("user = ", user)
grid_return5['selected_rows'] = user
st.write("grid_return5 = ", grid_return5)