Hi,
I am trying to solve an issue on my Dash Plotly app where the Outputs
and Inputs
for a callback gets generated based on the data from a CSV file. The problem happens when the said CSV file is updated by pulling it from S3 bucket. Since the data changes, but the Outputs
and Inputs
of the callback still remains same, the application does not respond to html input fields the same way. Here is how the callback is setup
@app.callback(
output=g_table_hidden_outputs + [Output('total-master-table', 'children'), entry_cell_placeholder_outputs,
sp_status_value_outputs, sp_status_style_outputs, tl_delta_value_outputs,
tl_delta_name_outputs,
r_extrap_value_outputs,
r_extrap_name_outputs, entry_cell_outputs, entry_cell_name_outputs,
Output("download-dataframe-csv", "data")],
inputs={'d_value': Input('d-num-input', 'value'),
'o_hori': Input('tl-outlook-input', 'value'),
'g': Input('g-dropdown', 'value'),
'fill_recommended': Input('fill-recommendations-button', 'n_clicks'),
'download': Input("download-button", "n_clicks"),
'entry_cell_inputs': entry_cell_inputs,
'placeholder_inputs': entry_cell_placeholder_inputs
}
)
def update_application(d_value, o_hori, g, fill_recommended, download, entry_cell_inputs,
placeholder_inputs):
The variables in the inputs and outputs above gets returned from a function that reads a CSV file, i.e g_table_hidden_outputs
, entry_cell_placeholder_outputs
should update when new CSV is downloaded from S3, but they do not at the moment. The issue occurs when I want to update the CSV from S3. As soon as a pull the new CSV, the UI changes (new table gets created with new data from the CSV as I have the app.layout function assigned to a function to update it), but the input and outputs are not connected to each other. The callback shows an error similar to below (i removed the full stack trace, but provided the two important lines):
[2023-11-17 12:54:04,902] ERROR in app: Exception on /_dash-update-component [POST]
.
.
.
Path: () Expected length: 12 Received value of length 28:
I am not sure if something like this is possible where, after reading the CSV file I want to dynamically build html input elements and dropdowns that are connected to the callbacks’ decorator.
Apologies if my post is a bit confusing. Any help or pointer would be highly appreciated.
Thanks