Editable DataTable, save input without pressing 'enter'

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

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


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

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:

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

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

I have no idea.
Ask @adamschroeder about it.

Hi @anuj_tiwari
What are you trying to do exactly?

1 Like