Getting error when changing value on streamlit elements component

Custom Components
1

I am employing the latest streamlit elements component to build a filtering mechanism using select boxes. I am trying to store and retrieve the data from the selectboxes though when using the method highlighted in the docs, I get an error "KeyError 'target'".

The code employed:


from streamlit_elements import elements, mui, html
with elements("dashboard"):
     from streamlit_elements import dashboard
     from streamlit_elements import nivo

      layout = [
                        # Parameters: element_identifier, x_pos, y_pos, width, height, [item properties...]
                        dashboard.Item("first_item", 2, 0, 5, 2, isResizable=False),# isDraggable=False, moved=False),
                    ]

       if "my_text" not in st.session_state:
           st.session_state.my_text = ""

         # When text field changes, this function will be called.
         # To know which parameters are passed to the callback,
         # you can refer to the element's documentation.
         def handle_change(event):
              st.session_state.my_text = event.target.value
                    
          charts = ['Bar chart', 'Scatter chart', 'Line Chart']
          chart_v = ['b', 's', 'l']

          with dashboard.Grid(layout):
                with mui.Paper(elevation=5, square=True, key='first_item'):
                     with mui.Box(width="47%", key="type of chart"):
                          with mui.TextField(label='Type of chart', sx={'margin-left':'4%', 'margin-top':'2%'}, select=True, fullWidth=True, value=st.session_state['my_text'], onChange=handle_change):
                               for chart, c_v in zip(charts, chart_v):
                                   mui.MenuItem(chart, value=c_v)

The above gives me this error:

I have tried:

  1. Did not include the value parameter in the TextField element
  2. Instead of st.session_state.my_text, I used a hard coded "" to no avail.

Any reason why this is not working and how can I amend it? It works when I use it as a plain text field but not a select box element.

Thanks

2

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