How do I make a table with clickable cells in jupyter notebook?

Question

I have a table and a plot below, I need to make the plot to be updated whenever a table cell is clicked.

ipywidgets library doesn't have a dedicated table widget.

qgrid doesn't have a callback for cell selection, only for row selection (I suspect I could hack it to react to cell clicks, but I guess the efforts required are comparable to making a raw html table clickable).

pivottablejs is cool, but it is an overkill for my task.

bokeh DataTable appears to have no callbacks at all.

In Bokeh you could have a JS or Python callbacks for` DataTable` via callback attached to its ColumnDataSource. You can check this post if it's what you want. — Tony
– Tony, Commented May 9, 2019 at 10:53
@Tony Do I understand correctly that in order to have python callbacks in this solution I need to start bokeh server? — Antony Hatchkins
– Antony Hatchkins, Commented May 9, 2019 at 11:00
Yes, Python callbacks are only possible when running Bokeh server. But It is also possible to detect cell clicks in a table using pure JS callback. See this post. The Python callback there was added to reset the indices but is not necessary anymore with the latest Bokeh v1.1.0 and can be omitted — Tony
– Tony, Commented May 9, 2019 at 11:02
@Tony Starting bokeh server doesn't fit in well into my workflow and I'd prefer python callbacks, so for now I'd stick to "emulating" table with the grid of ipywidgets buttons as described here: stackoverflow.com/questions/37528992/… — Antony Hatchkins
– Antony Hatchkins, Commented May 9, 2019 at 11:07

Aaron Watters · Accepted Answer · 2019-05-21 19:52:17Z

You can usually attach Python callbacks to Javascript objects using jp_proxy_widgets almost the normal way you would do it using only Javascript.

For example here I create a "vanilla" table and attach a click callback to a table element:

You can also do something similar with your favorite Javascript library (with some caveats -- see the documentation). Please have a look at jp_proxy_widgets here:

https://github.com/AaronWatters/jp_proxy_widget

Webthusiast · Accepted Answer · 2023-11-01 10:24:11Z

Streamlit provides editable dataframes:

df = pd.DataFrame( [ {"command": "st.selectbox", "rating": 4, "is_widget": True}, {"command": "st.balloons", "rating": 5, "is_widget": False}, {"command": "st.time_input", "rating": 3, "is_widget": True}, ] ) df = load_data() edited_df = st.data_editor(df) # 👈 An editable dataframe favorite_command = edited_df.loc[edited_df["rating"].idxmax()]["command"] st.markdown(f"Your favorite command is **{favorite_command}** 🎈")

(example taken from their website)

nik · Accepted Answer · 2022-09-02 10:15:40Z

You can do this now greatly with panel's new tabulator

Example:

import pandas as pd import panel as pn import numpy as np pn.extension('tabulator') sel_df = pd.DataFrame(np.random.randn(3, 5), columns=list('ABCDE')) select_table = pn.widgets.Tabulator(sel_df, selection=[0, 2]) def click(event): print(f'Clicked cell in {event.column!r} column, row {event.row!r} with value {event.value!r}') select_table.on_click(click) select_table

Collectives™ on Stack Overflow

How do I make a table with clickable cells in jupyter notebook?

3 Answers 3

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Linked

Related