Unable to see UI filter for String Data Type columns for Streamlit Aggrid table

[Neha_Kumari]

Hi Team,
I am new to this st_aggrid package.
I saw one video on YouTube where the presenter was using st_aggrid to create a AgGrid table out of a pandas dataframe and for him, the UI filters were available for all the columns.

I am in an impression that AGgrid tables are by default having filters, we don’t need to set any specific property to explicitly turn the filter on(Correct me,if I am wrong)

I tried to replicate same thing, only thing which I am doing is instead of reading the CSV file directly, I am uploading it and reading on runtime.

Will that make a difference , I also tried to do it by reading a static csv file, but still filters are not showing on UI for me for the string data type columns, but they are for numeric columns?

Below is my code

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

Load CSV file

@st.cache_data
def load_data(file_path):
return pd.read_csv(file_path)

def main():
st.title(‘Interactive Table with Streamlit AgGrid’)

# Upload CSV file
uploaded_file = st.file_uploader("Upload CSV file", type=['csv'])

if uploaded_file is not None:
    df = load_data(uploaded_file)

    # Create GridOptionsBuilder to customize grid options
    gob = GridOptionsBuilder.from_dataframe(df)
    gob.configure_column("allColumns", filter=True)

    gridOptions = gob.build()

    # Display the table using streamlit-aggrid
    AgGrid(df, gridOptions=gridOptions, update_mode=GridUpdateMode.MODEL_CHANGED)

if name == “main”:
main()

And Snapshot of the result I am getting

[Oscar1]

Hi,

You are trying to configure all columns with the filter option set to True. However, to enable filtering for string columns, you need to specify the filter option for each individual column. We can achieve this by iterating over each column and setting the filter option accordingly.

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

# Load CSV file
@st.cache_data
def load_data(file_path):
    return pd.read_csv(file_path)

def main():
    st.title('Interactive Table with Streamlit AgGrid')

    # Upload CSV file
    uploaded_file = st.file_uploader("Upload CSV file", type=['csv'])

    if uploaded_file is not None:
        df = load_data(uploaded_file)

        # Create GridOptionsBuilder to customize grid options
        gob = GridOptionsBuilder.from_dataframe(df)

        # Configure column filters for all columns
        for column in df.columns:
            gob.configure_column(column, filter=True)

        gridOptions = gob.build()

        # Display the table using streamlit-aggrid
        AgGrid(df, gridOptions=gridOptions, update_mode=GridUpdateMode.MODEL_CHANGED)

if __name__ == "__main__":
    main()

[Parth_Chokhra]

@Neha_Kumari ,
Or you can use

gb = GridOptionsBuilder()
    gb.configure_default_column(
        alwaysShowHorizontalScroll = True,
        alwaysShowVerticalScroll= False,
        filter = True,
        groupable=True,
        enableCellTextSelection=True,
        rowHeight=100,
        wrapText=wrap_text,
        autoHeight=auto_height,
        enableRangeSelection=True,
        
        
    )