How to show full text in Aggrid?

🧩 Streamlit Components streamlit-aggrid
,
1

Summary

How can I wrap the text in my AgGrid so you can see the full text?

This is what my grid looks like.

image

Steps to reproduce

This is how I’m building my grid. I tried passing the wrap header text variable but that doesn’t seem to work. I need to be able to edit this column, so tooltips wouldn’t be helpful.
Code snippet:

df = st.session_state['data']
        gd = GridOptionsBuilder.from_dataframe(df)
        gd.configure_pagination(enabled=True)
        
        gd.configure_column("Notes", wrapHeaderText=  True, autoHeaderHeight= True)
        gd.configure_default_column(editable=True, groupable=True)
        print('4')
        gd.configure_selection(selection_mode = 'multiple',use_checkbox=False)
        gridoptions = gd.build()
        grid_table = AgGrid(df, columns_auto_size_mode=ColumnsAutoSizeMode.FIT_CONTENTS, gridOptions=gridoptions,
                            update_mode=GridUpdateMode.SELECTION_CHANGED | GridUpdateMode.VALUE_CHANGED,
                            height=650, width = 8000,
                            allow_unsafe_jscode=True,

Thank you very much.

Using Streamlit 1.11 and streamlit-aggrid 0.3.3

2

Here is the answer. I added in the below code

gd.configure_columns("Notes",wrapText = True)
gd.configure_columns("Notes",autoHeight = True)

Full code looks like this

    gd = GridOptionsBuilder.from_dataframe(df)
    gd.configure_pagination(enabled=True)
    
    gd.configure_columns("Notes",wrapText = True)
    gd.configure_columns("Notes",autoHeight = True)
    gd.configure_default_column(editable=True, groupable=True, wrapText = True)
    print('4')
    gd.configure_selection(selection_mode = 'multiple',use_checkbox=False)
    gridoptions = gd.build()
    grid_table = AgGrid(df, columns_auto_size_mode=ColumnsAutoSizeMode.FIT_CONTENTS,gridOptions=gridoptions,wrapText=  True,
                        update_mode=GridUpdateMode.SELECTION_CHANGED | GridUpdateMode.VALUE_CHANGED,
                        height=650, width = 8000,
                        allow_unsafe_jscode=True,
1 Like