Edit and save button regarding textarea

Dash Python
2

Hi @gks123 ,

I think this should work:

import dash
from dash import html, Input, Output, State, dcc, callback_context

app = dash.Dash(__name__)
app.layout = html.Div(
    [
        dcc.Textarea(
            id='textarea_comments_growth',
            value='',
            placeholder='Write comments here',
            persistence=True, persistence_type='local',
            readOnly=True,
            style={'width': '100%', 'height': 200, 'display': 'block'}),
        html.Button('Save', id='save_button_growth', n_clicks=0, hidden=True),
        html.Button('Edit', id='edit_button_growth', n_clicks=0),
        html.Div(id='comments_growth', style={'whiteSpace': 'pre-line'}),
    ]
)


@app.callback(
    [
        Output('textarea_comments_growth', 'readOnly'),
        Output('save_button_growth', 'hidden'),
        Output('edit_button_growth', 'hidden'),
        Output('comments_growth', 'children'),
    ],
    [
        Input('edit_button_growth', 'n_clicks'),
        Input('save_button_growth', 'n_clicks'),
    ],
    State('textarea_comments_growth', 'value'),
    prevent_initial_call=True
)
def update_output(edit, save, comment):
    trigger = callback_context.triggered_id
    if trigger == 'edit_button_growth':
        return False, False, True, comment
    else:
        return True, True, False, comment


if __name__ == '__main__':
    app.run_server(debug=True)
1 Like