In a Dash layout, I’m generating a DateRangePicker with default values. In the code snippet below it is associated with id=‘date-picker-container’
html.Div([
html.Div('Pick a coverage date range'),
html.Div('(Default start = four weeks prior to latest date)'),
html.Div([
html.Div(
children=None,
**id='date-picker-container'**
),
html.Button('Refresh Graph',
id='refresh-graph-btn',
style={
'float': 'right',
'backgroundColor': colors['text']
}
),
html.Button('Refresh Date',
id='refresh-date-btn',
style={
'float': 'right',
'backgroundColor': colors['text']
}
)
]),
]),
...
@app.callback(
dash.dependencies.Output(**'date-picker-container'**, 'children'),
[dash.dependencies.Input('refresh-graph-btn', 'n_clicks')]
)
def display_default_datepicker(n_clicks):
return dcc.DatePickerRange(
**id='date-picker-range',**
min_date_allowed=min_date,
max_date_allowed=max_date,
start_date=min_date,
end_date=max_date
)
I am trying to reference the datepicker (id=‘date-picker-range’) as an input to a different callback
@app.callback(
dash.dependencies.Output('coverage-graph', 'figure'),
[dash.dependencies.Input('filter-subject', 'value'),
dash.dependencies.Input('refresh-graph-btn', 'n_clicks')],
[dash.dependencies.State(**'date-picker-range',** 'start_date'),
dash.dependencies.State(**'date-picker-range',** 'end_date')]
)
def display_graph(s_value, n_clicks, start_date, end_date):
tickvals_f = subject_list['yvalue']
ticktext_f = subject_list['subject_id']
....
But I get the following Reference Error - It does not recognize the id ‘date-picker-range’
ReferenceError: An invalid input object was used in a
State
object of a Dash callback. The id of this object isdate-picker-range
and the property isstart_date
. The list of ids in the current layout is `[date-picker-container, refresh-graph-btn, refresh-date-btn, filter-subject, graph-container, coverage-graph]
If I directly instantiate that DatePickerRange in ‘date-picker-container’, it is recognized. If I let it be generated via a callbak, it does not. This is a very similar to the pattern I followed at
https://github.com/plotly/dash-recipes/blob/master/dash-update-datepicker-range.py
I can’t determine what I’m doing wrong. Any insight would be greatly appreciated.
Regards