Any current solutions to dynamic callbacks for auto-generated components?

Dash Python
1

Hey, Dashers! I have a dash app that takes an XML file as an input and generates a report with feedback base on the elements in the XML. Essentially every time the element “Event” shows up in the XML it creates a table with html.Textarea textboxes with id=comment-0 through id=comment-n where n is the number of “Event” nodes in the XML. Essentially I need to get user feedback for each “Event” node.

However, I am having a decent amount of trouble creating callbacks based on the dynamically created Textarea inputs. I have read through this post and know this feature would offer me a solution, but I cannot determine how to construct a solution without this feature. Any help would be greatly appreciated as I have been stuck for quite some time. Looking for a definite answer if this is not possible so I can look at other frameworks.

Here was my lastattempt at a solution. I know below code does not work because nesting callbacks is not supported, and i know i cannot use a global variable, so essentially I am stuck. But I am seeking a definitive answer if this is possible (or if i am missing something), so I can move on if needed.

layout = html.Div([html.Div(style={'padding-top': 10}),
    html.Div(dcc.Dropdown(
        id='my-dropdown',
        options=xml_options,
        style={'height': '30px', 'width': '250px'},
        placeholder="Select a file")),
    html.Div(style={'padding-top': 10}),
    html.Div(id='html-output', children=[]),
    html.Div(id='feedback-json', style={'display': 'none'}),
    html.P(id='placeholder', style={'display': 'none'}),
    html.Button("Save annotations", id='save-button',
                                     style={"margin-bottom": "10px",
                                            'margin-right': '5px'})])

@app.callback(
    Output('html-output', 'children'),
    [Input('my-dropdown', 'value')])
def update_output(value):
    if value:
        xml_dict = xml_to_dict(value)

        table = create_feedback_table(xml_dict)

        num_comments = html.Div(id='num-comments', style={'display': 'none'},
                           children=len(xml_dict))

        return html.Div(button, table, num_comments)

@app.callback(
    [Output('placeholder', 'children')],
    [Input('save-button', 'n_clicks')],
    [State('num-comments', 'children')])
def get_num(n_clicks, num):
    @app.callback(
        [Output('feedback-json', 'children')],
        [Input('comment-{}'.format(i), 'value') for i in range(num)])
    def update_feedback(n_clicks, *values):
        print(values)
        print({'comment': value for value in values})
        return json.dumps({'comment': value for value in values})
    return [""]

This is a simplified version on my project to help focus on my attemp to solve this. I can feel any details needed.
[Edit:fixed typos; small additions for clarity]

2

From the example code you have given it seems like there is a fixed set of XML files, which are defined in xml_options. Since this set is fixed you can create all the required layout and callbacks ahead of time and then show/hide the layout components.

3

See Dynamic Controls and Dynamic Output Components