Editable DataTable, save input without pressing 'enter'

Dash Python
1

Hi all,

When a user input a value in an editable DataTable cell, he or she should press ‘enter’ key to save this value. If the user do not press ‘enter’, but for example click outside of the table, the input is not saved and cell value comes back to previous value.

I find it not user friendly at all as usual html inputs and forms have a different behavior (i.e. inputs are saved on focus out, while ‘enter’ usually is reserved to send form as post request).

Is there any way to change this behavior ? It is a small detail but it has a great impact (in my app) on user experience.

1 Like
2

Good idea !!!
I also want to change this behavior !!!
Could someone help with this ?

Best

3

Has anyone found how to do this yet? As I too need this functionality

4

I think you can build a callback to do that using this:

@app.callback(Output('your_table', 'data'),
               [Input("your_table", "data_previous"),
                State("your_table", 'data')],
)
def update_table(last, new):

    return new

It should trigger the callback each time the table is modiffy and taking the data as state and returning it as output should do the trick, I hope :thinking:

5

Hi All, Is this resolved or writing a callback is the only workaround here?

6

@Eduardo @martinp can you please help me here. is it implemented?

7

I have no idea.
Ask @adamschroeder about it.

8

Hi @anuj_tiwari
What are you trying to do exactly?

1 Like
9

Hi Adam,

I think the goal is to have cells save the input from users without having to hit enter. Right now if you type something and then click out of the table without hitting enter the value reverts to the previous value in the cell. I am still looking for a solution to this issue.

Also, does anyone know how to have the text align left so when a user starts typing the text starts on the left side of the cell and moves to the right side of the cell?

-Cameron

1 Like