CODEWITHSUNDEEP
javascriptpythonajaxdjango
ssc
ssc

Reputation: 9883

how to update a Django page without a page reload?

My Django app displays data from a database. This data changes without user intervention, i.e. behind the scenes. Whenever it changes, I would like the webpage to update the changed sections without a full page reload.

Obviously AJAX springs to mind. When the page is loaded initially (or manually, fully re-loaded later on), the rendered template loads a JavaScript that runs window.onload = update("all"), update(...) in turn triggers a number of XMLHTTPRequests which again return data that gets transformed into HTML pieces for the corresponding sections. All works fine. At the initial page load.

Now I find myself in a Python function that saves a new object to the database.

How do I tell the browser to run update(...) ?

Do I need to somehow manually issue a request to a url that is mapped to a view which in turn renders a template that contains the JavaScript code to run update(...) ??? Oh my!

I feel like I'm not following the usual approaches. Maybe I'm just standing to close in front of the problem.

Can anyone help me ?

Upvotes: 13

Views: 18151

Answers (3)

Neha Singla
Neha Singla

Reputation: 65

You can also use The Websocket API https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API. With this API, you can send messages to a server and receive event-driven responses without having to poll the server for a reply.

Upvotes: 0

Lou Franco
Lou Franco

Reputation: 89142

2021 update: Use channels: https://channels.readthedocs.io/en/latest/

You have two choices

  1. Have the browser poll using setTimeout()
  2. Look into Comet -- this is a technique for pushing data from the server to the browser.

Here's an article on Comet in Django

Upvotes: 9

Javier
Javier

Reputation: 62563

two approaches:

  1. just update the database and wait until the next AJAX query. That means it should do the query periodically, you'll have to balance between immediacy and server load. It helps a little if you can do a cheap query to just verify if there has been an update. Maybe make that check rely only on memcached instead of going to the DB

  2. use comet. In short: the client does an AJAX query asking for the update. the server sees there's no update, so it doesn't answer. Instead, the connection is kept open for a long time. Eventually either the update comes and the server finally answers, or the client times out and kill the connection. In that case, the client should immediately reissue the query to keep waiting for the update.

Upvotes: 7

Related Questions