Pass Data From Django Templates to Dash App While using `plotly_direct`

i am using plotly_direct into the integration between django and plotly, Andinitial_arguments are not currently supported, and as the app is directly injected into the page

So i can access the data from views.py into the html template but i can not pass it into dash app

Hey @toll, welcome to the forums. Could you add some sample code/explanation? I’m not sure if your description is understandable for everyone.

1 Like

oh sorry , Thanks for the reply and clarification

i have a problem passing data from django template to django dash app to use it in charts .
and i can not use initial_argument as a parameter because i am using plotly_direct
and i do not want to use plotly_app because it render the dash app as iframe.

This is The function that render html template in views.py

This is the rendered html template and i can get the data into it

Hello @toll,

If you want to send data from the template to the dash ecosystem, you can do so utilizing the new, as of 2.16.1, dash_clientside.set_props.

This allows any js function to set props for components in the system. I’d recommend using a dcc.Store setup to handle the data coming over.

1 Like

okay i tried , but i did not get anything into through dash app , what is wrong in my code?

this is the js script into student_performance.html :

and this is into dash app student_performance.py

app.layout = html.Div([
    dcc.Store(id='store-data', data={}),
    html.Div(id="container-events"),
])
@app.callback(
    Output('container-events', 'children'),
    Input('store-data', 'data'),
    prevent_initial_call=True
)
def update_output(data):
    print('Data received in callback:', data)
    if data:
        data_dict = json.loads(data)
        passed_hours = data_dict['passed_hours']
        cummulative_gpa = data_dict['cummulative_gpa']
        return f"Passed Hours: {passed_hours}, Cummulative GPA: {cummulative_gpa}"
    else:
        return "No data available"

Can you pause there and see what is says in the console? You might have to use the window or something to gain access to it.

It will also need to have dash actually exist in the layout at the same time.

I got the data that i need in the console

Does it have a warning when trying to use dash_clientside?

No
but sorry i did not understand what do you mean by “It will also need to have dash actually exist in the layout at the same time.”

sorry , you are right, i got this error in the console


Try it on window.dash_clientside.

Can you print window and potentially it’s inside of window.parent?

okay , i got this , i am not sure that i am printing window correctly or this is what do you mean


Oh. You need to be using dash 2.16.1

1 Like

okay :sob: :sob: i think that plotly_direct is not supported in dash 2.16.1
because i got these errors:


and when i searched , i got that The _generate_meta_html method was introduced in a later version of Dash,

A later version of Dash? 2.16.1 is the newest version. XD

That’s the downfall of non-vanilla apps. XD

@PipInstallPython might have a couple of pointers for this.

1 Like

This is a similar issue to this one so this response is similar: there are a couple of ideas here - essentially (a) use a different template tag or (b) create/update the dash app instance directly.

(for some reason the original post to this question got attached to another issue; probably user error…)

2 Likes

This is very frustrating. I wish I could find an easier way

using different tag will render the dash app as iframe which makes scroller,
and i did not really understand the second solution but i have 5 dash apps integrated in 5 different html templates, customizing all these details in views to render the dash apps once will be kinda difficult, and the data will changes based on the user who logged in
seperating files was more efficient