在使用模板系统时在 Django 中使用 JQuery 刷新 div

Posted

技术标签:

【中文标题】在使用模板系统时在 Django 中使用 JQuery 刷新 div【英文标题】:Refresh div using JQuery in Django while using the template system 【发布时间】:2011-04-16 03:35:20 【问题描述】:

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

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

这是我的 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 有一个包含标签:

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

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

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

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

【问题讨论】:

【参考方案1】:

对于这种情况,我通常解决 3-4 个“并发”请求的方法是将 setTimeout() 调用放在我想要重复运行的函数中。

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


$(function()
    refresh();
);

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

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


$(function()
    refresh();
);

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

我的一个建议(与您的问题并不特别相关)是将整个 &lt;table&gt; 东西放在您呈现的模板中并返回您的 temperature 视图。因此,在您的主模板中:

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

testing.html:

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

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

【讨论】:

谢谢!尽管我尝试了两个 js 函数,但它仍然需要 3-4 个并发调用。我将其更改为 setTimeout,结果正常。 哇!!这就是我在看到/编写 setInterval 时的想法。不错的收获!【参考方案2】:

注意:如果“testing.html”的内容比问题中的内容多,则 .js 将为:

function refresh() 
$.ajax(
  url: '% url monitor-test %',
  success: function(data) 
  var dtr = $("#div_to_refresh", data);
  $('#div_to_refresh').html(dtr);
        
    );
  setTimeout("refresh()", 3000);


$(function()
    refresh();
);

【讨论】:

以上是关于在使用模板系统时在 Django 中使用 JQuery 刷新 div的主要内容,如果未能解决你的问题,请参考以下文章

Django:在使用模板继承时在基本模板文件中加载自定义过滤器时出现问题

使用 BeautifulSoup 写入文件时在 Django 模板中保留空格

Django:引用模板中的url名称并传递参数

如何在启动时在后台运行django服务器?

db更改时在Django中重新加载HTML表

Django模板缓存刷新问题