在使用模板系统的同时在 Django 中使用 JQuery 刷新 div [英] Refresh div using JQuery in Django while using the template system

查看:18
本文介绍了在使用模板系统的同时在 Django 中使用 JQuery 刷新 div的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想刷新 Django 中包含温度数据的 div 标签.每 20 秒获取一次数据.到目前为止,我已经使用这些功能实现了这一点:

function refresh() {$.ajax({url: '{% url monitor-test %}',成功:功能(数据){$('#test').html(数据);}});};$(函数(){刷新();var int = setInterval("refresh()", 10000);});

这是我的 urls.py:

urlpatterns += patterns('toolbox.monitor.views',url(r'^monitor-test/$', '温度', name="monitor-test"),url(r'^monitor/$', 'test', name="monitor"),)

views.py:

def 温度(请求):温度字典 = {}对于 TemperatureDevices.objects.all() 中的 filter_device:get_objects = TemperatureData.objects.filter(Device=filter_device)current_object = get_objects.latest('Date')current_data = current_object.Datatemperature_dict[filter_device] = current_datareturn render_to_response('temp.html', {'temperature': temperature_dict})

temp.html 有一个包含标签:

<tr>{% 包含 "testing.html" %}</tr></tbody></table>

testing.html 只包含一个 for 标签来遍历字典:

{% for label, value in temperature.items %}<td >{{标签}}</td><td>{{值}}</td>{% 结束为 %}

div 每 10 秒刷新一次,允许我使用模板系统而无需用 js 打补丁.但是,几分钟后,我同时收到了 3-4 个对/monitor-test"的重复调用.另外,我想知道在能够在 Django 中使用模板系统的同时是否有更好的方法来做到这一点.谢谢.

解决方案

我通常绕过 3-4 个并发"的方式对这种情况的要求就是把setTimeout()调用放在我想重复运行的函数里面.

function refresh() {$.ajax({url: '{% url monitor-test %}',成功:功能(数据){$('#test').html(数据);}});设置超时(刷新,10000);}$(函数(){刷新();});

这样每次调用 refresh 函数时,它都会自动将自己设置为在 10 秒后再次调用.另一个想法(如果您仍然有问题)是将 setTimeout 移动到 AJAX 调用中的成功函数中:

function refresh() {$.ajax({url: '{% url monitor-test %}',成功:功能(数据){$('#test').html(数据);设置超时(刷新,10000);}});}$(函数(){刷新();});

如果由于某种原因 AJAX 调用没有成功,那么这个选项可能有点粗略.但是你总是可以通过其他处理程序来解决这个问题,我想......

我的一个建议(与您的问题不是特别相关)是将整个 <table> 内容放在您渲染并返回 温度 视图的模板中.因此,在您的主模板中:

{% 包含 'testing.html' %}

并在 testing.html 中:

{% 用于标签,温度值.items %}<td>{{标签}}</td><td>{{值}}</td>{% 结束为 %}</tr></table>

以您目前拥有的方式插入表的一部分让我想哭:) 在 AJAX 调用中通过线路发送更多字节应该不会有任何伤害.

I want to refresh a div tag in Django that contains temperature data. The data is fetched every 20 seconds. So far I have achieved this using these functions:

function refresh() {
$.ajax({
  url: '{% url monitor-test %}',
  success: function(data) {
  $('#test').html(data);
  }
});
};
$(function(){
    refresh();
    var int = setInterval("refresh()", 10000);
});

And this is my urls.py:

urlpatterns += patterns('toolbox.monitor.views',
    url(r'^monitor-test/$', 'temperature', name="monitor-test"),
    url(r'^monitor/$', 'test', name="monitor"),
)

views.py:

def temperature(request):
  temperature_dict = {}
  for filter_device in TemperatureDevices.objects.all():
    get_objects = TemperatureData.objects.filter(Device=filter_device)
    current_object = get_objects.latest('Date')
    current_data = current_object.Data
    temperature_dict[filter_device] = current_data 
  return render_to_response('temp.html', {'temperature': temperature_dict})

temp.html has an include tag:

<table id="test"><tbody>
<tr>
{% include "testing.html" %}
</tr>
</tbody></table>

testing.html just contains a for tag to iterate through the dictionary:

{% for label, value in temperature.items %}
      <td >{{ label }}</td>
      <td>{{ value }}</td>
{% endfor %}

The div is refreshed every 10 seconds and allows me to use the template system without patching it with js. However, I get repeated calls to '/monitor-test', 3-4 at the same time after a couple of minutes. Also, I was wondering if there is a better way to do this while being able to use the template system in Django. Thanks.

解决方案

The way I normally get around the 3-4 "concurrent" requests for such situations is to put the setTimeout() call inside the function I want to run repeatedly.

function refresh() {
    $.ajax({
        url: '{% url monitor-test %}',
        success: function(data) {
            $('#test').html(data);
        }
    });
    setTimeout(refresh, 10000);
}

$(function(){
    refresh();
});

That makes it so every time the refresh function is called, it will automatically set itself to be called again in 10 seconds. Another idea (if you still have problems) is to move the setTimeout into the success function in the AJAX call:

function refresh() {
    $.ajax({
        url: '{% url monitor-test %}',
        success: function(data) {
            $('#test').html(data);
            setTimeout(refresh, 10000);
        }
        
    });
}

$(function(){
    refresh();
});

That option might be a little bit sketchy if, for whatever reason, the AJAX call does not succeed. But you can always get around that with other handlers, I suppose...

One suggestion I have (not particularly related to your question) is putting the whole <table> thing in the template that you render and return your temperature view. So, in your main template:

<div id="test">
{% include 'testing.html' %}
</div>

and in testing.html:

<table><tr>
{% for label, value in temperature.items %}
    <td>{{ label }}</td>
    <td>{{ value }}</td>
{% endfor %}
</tr></table>

Something about inserting part of a table the way you currently have it makes me want to cry :) Sending a few more bytes over the wire in AJAX calls shouldn't hurt anything.

这篇关于在使用模板系统的同时在 Django 中使用 JQuery 刷新 div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆