Is it possible to customize Link in data_editor

🎈 Using Streamlit
,
1

I am using data editor and passing the data and generating the table fine. One of the columns is going to be a hyperlink to get more information about the row. I was wondering if it is possible to edit the data to create your link. I.E Data is a list of id’s (1,2,3 etc.) and by default the editor adds to the end of the url like www.myapp.com/{id}, is it possible to change it so it can be something like www.myapp.com/something={id}

Or is it possible to merge two columns into one? Have one column be the correct link and the second column be the correct display. Don’t see if this is possible in the documentation.

2

Hi @elsuenog, welcome to the forum!

Here’s one way to do it

import streamlit as st

import pandas as pd

if "df" not in st.session_state:
    st.session_state.df = pd.DataFrame({"x": [1, 2, 3]})
    st.session_state.df["link"] = (
        "https://www.myapp.com/something/" + st.session_state.df["x"].astype(str)
    )

out = st.data_editor(
    st.session_state.df,
    column_config={"link": st.column_config.LinkColumn(disabled=True)},
    hide_index=True,
    num_rows="dynamic",
)

if (
    not out["link"].equals("https://www.myapp.com/something/" + out["x"].astype(str))
    and not out["x"].isna().any()
):
    st.write("changed")
    out["link"] = "https://www.myapp.com/something/" + out["x"].astype(str)
    st.session_state.df = out
    st.rerun()
3

Thanks, this seems to work for data editor not but not for dataframes. Turns out I don’t really need the editing portion of data_editor for this page I am working on. I was able to manipulate the data to just do a path instead of the full URL. But my issue now is that I cannot get the display value to display what I actually want instead of the path that is currently being displayed. I also do not want to convert to html because that removes some functionality(mainly sorting).

4

Can you clarify exactly what you’re trying to have in the dataframe, and what you would like to see displayed? I think you will be able to accomplish it with st.column_config.LinkColumn - Streamlit Docs

5

So the value is not a Full URL. It’s just a string that adds to the end of the URL. (don’t have full domain yet so just working locally). The value is a subdirectory that I need to go to. But the Label I want to display on the dataframe to the users is something else.

Ex. The value I am passing to the dataframe is ‘/grant_info?Grant_name=name&grant_id=1’. I want the Label(display value) to be a combination of the {Grant_name} and the {Grant_Id}.

6

I would recommend doing what I did, then, just with 2 plusses to combine all the parts of the url:

st.session_state.df["link"] = (
      "/grant_info?grant_name=" + st.session_state.df["grant_name"].astype(str) + "&grant_id=" + st.session_state.df["grant_id"].astype(str)
  )
7

Sorry, I believe I wasn’t super clear with what I wanted to do on my end. My issue is now the display name, I was able to modify the data getting passed in to pass in the string I wanted. My issue is trying to manipulate the display name so it will show something more user friendly. my data is something like this “/Grant_info?grant_id=1&user_rest=0” What I want displayed is “Grant {Grand_id}” is so in the example above it would be Grant 1.

8 
         "grant_name": st.column_config.LinkColumn(
            "Grant Name",
            display_text="/Grant_info?grant_id=(.*?)&user_rest=0"
        ),

I tried something like above code. but I believe that type of formating only works with complete urls. Because nothing changes visually on my end. So I would have to use the panda style formater?

9

Ah, that makes sense – it looks your example works if you escape the first ?

df = pd.DataFrame(
    {
        "grant_name": [
            "/Grant_info?grant_id=1&user_rest=0",
            "/Grant_info?grant_id=2&user_rest=0",
            "/Grant_info?grant_id=3&user_rest=0",
        ],
    }
)


st.dataframe(
    df,
    column_config={
        "grant_name": st.column_config.LinkColumn(
            "Grant Name",
            display_text="/Grant_info\?grant_id=(.*?)&user_rest=0",
        )
    },
)

image