Dash Table - Dropdowns Inside Table?


#1

Hey All,

Is there a way to add drop-downs as part of rows in an editable table? There is this use case where I would like the user to select an item from the drop-down in Column A and then set some arbitrary value in Column B:

Column A Column B
Banana 10
Apple 5
Orange 6

Where Column A contains a list of [Banana, Apple, Orange]

Thanks!


Display tables in Dash
#2

There is not right now. However, I am working on a brand new table component that will incorporate this.

Here is a sneak preview:


Display tables in Dash
#3

[troll]Are you recoding ethercalc :stuck_out_tongue: ?[/troll]

Many thanks!


#4

This is amazing work Chris! Might be asking for alot here but is there any alpha source code I can take a look at with the drop-down example you have?


#5

for the time being, i used an html.Table and adjusted the entries according to predefined variables(dcc.Dropdown or dcc.Input.
would be extremely tedious if you’ve got a large table though.


#6

Unfortunately it’s not ready to be shared yet. It’s currently being developed for a customer project (https://plot.ly/products/consulting-and-oem/) and we’ll share it once it becomes more stable.


#7

No worries. Amazing work by the way!


#8

That looks amazing @chriddyp. Cant wait!!! :smile:


#9

Hey @Ola, can you please share me a small working code. I’m stuck at this point and not able to figure it out on how to update it. Thanks.


#10

Unfortunately, I overwrote the code I had, but it was something along the lines of:
x = dcc. Input(...)
y = dcc. Dropdown(...)
html.Table(html.Tr(html.Td(x), html.Td(y))) repeated for the number of rows needed.

I hope that helps :slight_smile:


#11

Plotly Dash desperately needs a full-dancing and singing data table component.
Atm, I have switched from current table prototype to html.Table(), because prototype had made my code unnecessary complicated (in my use-case). But I believe that in the future, python server callbacks for a data table is such a unique feature in Dash that it will make all those fancy javascript table libraries run for their money.
Keep up the great work @chriddyp !


#12

Thanks @Vlad! The new Table is one of my top priorities right now, look forward to an initial release within the next month or so.