首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Django -使用Javascript刷新模板中div的最佳方法?

Django -使用Javascript刷新模板中div的最佳方法?
EN

Stack Overflow用户
提问于 2017-03-02 13:44:32
回答 1查看 2.1K关注 0票数 2

我想刷新<div>,我的谷歌图表嵌入在每30秒,以显示更新的数据,在模型中,它正在使用。

下面是模板:

metrics.html

代码语言:javascript
复制
{% extends 'metrics/metrics_header.html' %}
{% block content %}

    <h1>Metrics</h1>
    <p>Submitted = {{ submitted }},
        Conforming = {{ conforming }}
        Transcoding = {{ transcoding }}
        Complete = {{ complete }}
        Error = {{ error }}
    </p>

      <script type="text/javascript">
        google.charts.load("current", {packages:['corechart']});
        google.charts.setOnLoadCallback(drawChart);
        function drawChart() {
          var data = google.visualization.arrayToDataTable([
                ['Job State', 'Jobs', { role: "style" }],
                ['Submitted', {{ submitted }},'blue'],
                ['Conforming', {{ conforming }},'purple'],
                ['Transcoding', {{ transcoding }},'yellow'],
                ['Complete', {{ complete }},'green'],
                ['Error', {{ error }},'red']
          ]);

          var view = new google.visualization.DataView(data);
          view.setColumns([0, 1,
                           { calc: "stringify",
                             sourceColumn: 1,
                             type: "string",
                             role: "annotation" },
                           2]);

          var options = {
            title: "Total Number of Jobs Processed",
            bar: {groupWidth: "100%"},
            legend: { position: "none" },
          };
          var chart = new google.visualization.ColumnChart(document.getElementById("columnchart_values"));
          chart.draw(view, options);
      }
      </script>
<div id="columnchart_values" style="width: 100%; height:600px;"></div> 
{% endblock %}

我一直在使用它刷新整个页面::

代码语言:javascript
复制
<script>
    setTimeout(function(){
        window.location.reload(true);
    }, 5000);
</script>

正如您可以想象的那样,如果整个页面每5秒重新加载一次,那么是否有一种更令人兴奋的方式来重新加载包含<div>变量的jinja2呢?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-03-13 13:32:26

我使用Jquery .load()解决了我的问题。

代码语言:javascript
复制
setInterval(function () {

    $("#div-you-want-to-reload").load("url-for-source-content");

}, 1000); // This reloads the <div> every 1 second.

我把这个和Django一起使用,所以我必须创建一个视图来创建"url-for-source-content",然后在我的url模式中尊重这个应用程序。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/42557142

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档