Hi, I am using datepickersingle in my dash app where i need today’s date because it should show live data every time I open the app, it shows new date but charts with the date created the day I made my app. I have used intervals and also gave added my app layout in a function. Please help
here i have created my datepicker logic and have added in navbar
html.Div(
[
dcc.DatePickerSingle(
id='date-range_1',
min_date_allowed=dt(2023, 1, 1),
max_date_allowed=dt(2024, 12, 31),
date=datetime.datetime.today().date() # Actual code
# datetime.date.today(),
),
dmc.Button(id='submit-button',
n_clicks=0,
# title= 'Update the OutPut',
# children='Update the Output'
leftIcon=DashIconify(icon="ion:refresh",
# width=20
),
style={'color': 'black'}
),
#
# html.Div([
# dbc.Spinner(html.Div(id="loading-output"), color="danger", type="grow"),
# ]),
],
className='date_output',
style={
'position': 'absolute',
'right': '10px'
}
),
##############################################################
This is my layout and its defined in a function so that I get live updated data
def serve_layout():
return dbc.Container([
dbc.Row([
navbar_2,
html.Div([
dbc.Spinner(html.Div(id=“loading-output”), color=“info”, size=‘lg’, # type=“grow”,
spinner_style={“width”: “8rem”, “height”: “8rem”}
),
],
# style={‘position’: ‘relative’, ‘top’: ‘400px’, ‘z-index’: ‘1000’}
style={
'position': 'absolute',
'top': '50%',
'left': '50%',
'transform': 'translate(-50%, -50%)',
'z-index': '1000',
}
),
]),
html.Br(),
menu_bar,
dbc.Row([
dbc.Col([
dcc.Graph(
id="sweeper_attendance_overall", # config={"displayModeBar": False},
),
# html.Button('Download Excel', id='download-button-1', type='button' , className= 'btn btn-outline-info'), # Button1
],
style={
# 'padding-right': '0',
# 'border-radius': '10px',
'border-radius': '1.5rem'
}, sm=4, className='position-relative rounded_graph mt-4',
),
dbc.Col([
dcc.Graph(
id="sweeper_zone_attendance", # config={"displayModeBar": False},
style={'border-radius': '10px'}),
# html.Button('Download Excel', id='download-button-2', type='button' , className= 'btn btn-outline-info'), # Button1
],
style={
# 'padding-right': '0',
'border-radius': '1.5rem',
}, sm=4, className='position-relative rounded_graph mt-4'
),
dbc.Col([
dcc.Graph(
id="sweeper_ward_attendance", # config={"displayModeBar": False},
style={'border-radius': '10px'}),
# html.Button('Download Excel', id='download-button-2', type='button' , className= 'btn btn-outline-info'), # Button1
],
style={
# 'padding-right': '0',
'border-radius': '1.5rem',
}, sm=4, className='position-relative rounded_graph mt-4'
),
]),
dcc.Interval(
id='interval-component-2',
interval=600 * 1000, # in milliseconds
n_intervals=0
),
], fluid=True,
className=‘background min-vh-100’
)
app.layout = serve_layout
Now my callbacks for interval and updating date at backend
@app.callback(
Output(“loading-output”, “children”), [Input(“submit-button”, “n_clicks”)]
)
def load_output(n):
if n:
time.sleep(1)
# return f"Output loaded {n} times"
# return “Output not reloaded yet”
import datetime
@app.callback(
Output(“date-range_1”, “date”), [Input(“interval-component-2”, “n_intervals”)]
)
def load_output(n_intervals):
# import datetime
date_new = datetime.date.today()
# date_new = datetime.now()
# date_new = datetime.now().date()
# max_date = dt.strptime(date_new, '%Y-%m-%d')
# print('printing current date', date_new)
return date_new # or max_date, depending on your use case
final callback
def update_charts(n, button_click, date, zone, ward, kothi, sweeper_name):
# if button_click == 0 :
# raise PreventUpdate
#
# else :
# def update_charts(n, button_click, e,f,g):
n is interval input and button_click is my filter button, e,f,g are my filters added in state
end = dt.strptime(date, '%Y-%m-%d')
# print(end)
############# then charting logic