Question

How do I refresh a certain element within a django template?
Example:

{% if object.some_m2m_field.all %}
    <h3>The stuff I want to refresh is below</h3>
    <div id="the-div-that-should-be-refreshed">
    {% for other_object in object.some_m2m_field.all %}
        <a href="www.example.com">{{ other_object.title }}</a>
        &nbsp;
    {% endfor %}
    </div>
{% endif %}

Lets say some other element in the page triggers a javascript that should refresh the div above. Is there a way to cause django to refresh this specific element within the template?

If not, I’ll have to monkey-patch the div using regular JS or jQuery methods and not use the great power of django’s template layer. Also, the above code is a simplification of the actual template, I use much of the template’s power, so monkey-patching the resulting html will be a nightmare…

Answer 1

You could use an async request to fill the div element.
The async request is answered by Django using the template engine.

In this case, you would have to outsource the template code of the div element into a separate template file.

UPDATED WITH EXAMPLE:

Javascript:
For refreshing the view asynchronously, use JQuery for example:

$.ajax({
  url: '{% url myview %}',
  success: function(data) {
  $('#the-div-that-should-be-refreshed').html(data);
  }
});

Async View:

def myview(request):
    object = ...
    return render_to_response('my_template.html', { 'object': object })

Template:

{% for other_object in object.some_m2m_field.all %}
    <a href="www.example.com">{{ other_object.title }}</a>
    &nbsp;
{% endfor %}