How to fetch real time sql data without refreshing page

HI @bsbalkar
Your df = dataframe() function is outside any callback functions. That is why your SQL data never gets triggered and is only refreshed when your page loads. Try putting the df = dataframe() inside your callback like this.

@app.callback(
    [Output(component_id="Speed_Length_Graph", component_property="figure"),
     ],
    [
     Input(component_id="Date", component_property="value"),
     Input(component_id="select_PO", component_property="value"),
     Input(component_id="select_RunCategory", component_property="value"),
     Input(component_id="refresh", component_property="n_intervals")
     ])
def update_graph(Date_value, PO_Number, Run_Category, n):
    
    # To filter df w.r.t. dropdown values
    if Date_value is not None:
        if PO_Number is not None:
            if Run_Category is not None:
                df = dataframe()
                .....

You don’t even need the interval in the callback above. Maybe you can try doing a separate callback just for the interval and sql data update, and store it in dcc.Store(). Then you can use your data from Store in your Dropdown callbacks:

@app.callback(
    Output(store, 'data'),
    [Input(component_id="refresh", component_property="n_intervals")]
)
def update_graph(n_intervals):
    df = dataframe()
    return df

Don’t forget to include the dcc.Store(id='memory') inside the app.layout() section.
You can read more about dcc.Store here.

P.S. you might encounter issues with data refreshing every 30 seconds because you don’t want the dropdown data options to change while users are choosing values in the dropdowns.