DjangoDash How to use django pure html with dash callbacks

Dash Python
1

Hi guys!
I was wondering, my team and I are considering using Django with Dash and React to build our application!
Django - backend
React - frontend
Dash - dashboards (also frontend)

So one thing I was trying to find out how to do but couldn’t is using pure HTML in a Django template,
create an element, give it an id, and use that element inside a dash callback.

for example:
inside an HTML file I would have:

inside the python dash file we will have a callback retuning value to that element
Output(“hello”, “children”)

Anyone knows a way to do this? / a repo with an example would be awesome!

2

Have you taken a look at django-plotly-dash? This is something we built that allows you to embed Dash applications in HTML using Django template tags.

3

@delsim yes, I did, I already created an app using Django and dash, the problem is that I cannot find a way to make dash callbacks interact with the outside HTML elements.

4

You could use clientside callbacks to update the external components.

Clientside callbacks can also be used to bring data from the external into the components. Clientside callbacks uses JavaScript and you can query the external components from there.

The interesting part is determining how to trigger the callbacks, the easiest is a button click, because you can trigger that easily from the JavaScript side.

5

clientside callbacks are used for speeding up tasks that can be done on the client side. it’s not what I am looking for.
I want to be able to write python code (regular callbacks) to interact with outside elements.

6

Clientside callbacks arent only limited for speeding up tasks. That is a side effect or benefit.

I understand your resistance to it and wanting to only use python though.

However, there is a package for this if you are interested:

django-dash · PyPI.

Not sure what it does as I dont use Django.

7

I know the library, couldn’t find anything in it to answer my problem.

thanks anyway.

8

You might want to think about what sort of interaction you want with the rest of the page. An embedded Dash app (and this is a general statement no matter what package you use to embed it or even if Django is or is not the vehicle used to serve it) is not going to know about the html page outside of the app.

Dash callbacks are essentially stateless, so to communicate with the rest of the page you’re going to have to have a Dash component use javascript, as per @jinnyzor’s comment above, or find some other way to pass messages to the page, which will effectively do the same thing.

9

@delsim,

As long as the html page is in the same origin, you can communicate in and out of iframes. It’s not as fun, but it is possible.

10

@jinnyzor yes, that is my point - as per your comment, you’ll need some javascript to communicate with the rest of the page. From a Dash app that is something along the lines of a clientside callback or a custom component that is doing the same thing.

1 Like