Data editor sort column

I have some data editor widgets on my Streamlit app, but I want to disable the option for the user to sort the rows. My idea is for the user to be able to input data, but not sort rows.

Is it possible?

1 Like

I have tried doing what you said but its not possible and there is no parameter for it
ref

But you can do it by printing it as table instead of dataframe

st.table(df)

This is the only way i found for it

Hopefully it will help you

Code used by me

import streamlit as st
import pandas as pd
data = {"Name": ["Alice", "Bob", "Charlie"],"Age": [25, 30, 22],"Salary": [50000, 60000, 45000]}
df = pd.DataFrame(data)
st.table(df)

I have the same challenge. I figure I should be able to do it via adding some script to the page, but I feel like I’m going to have to dive into javascript frameworks to figure this out.

I can select the column header elements on the page but struggling to remove the event from these elements.

st.markdown("""
    <script>
        const grid = document.querySelector('[data-testid="data-grid-canvas"]')
        const headers = grid.querySelectorAll('table thead tr th');
    </script>""",
    unsafe_allow_html=True)

The elements themselves don’t seem have to listeners, but instead respond to a Window-level listener that presumably routes interactions to the appropriate function somewhere deeper in the underlying framework. If I remove that Window-level listener via DevTools then I successfully disable the sorting… but also break a bunch of other stuff.

Any help appreciated on finding and disabling the listener/handler which is doing the sorting. Or any other creative solutions to remove interactivity (e.g. a transparent element on top of the column headers?).

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